Below is the HTML structure from my website
<div><iframe src="link.pdf" width="100%" height="500"> #document <!DOCTYPE html><html><head></head><body style="height: 100%; width: 100%; overflow: hidden; margin:0px; background-color: rgb(82, 86, 89);"><embed name="123333" style="position:absolute; left: 0; top: 0;" width="100%" height="100%" src="about:blank" type="application/pdf" internalid="1234"></body></html> </iframe></div>
Attach link for the new DOM structure after inspecting download from PDF viewer
<body><pdf-viewer id="viewer"></pdf-viewer>> #shadow-root(open)<viewer-toolbar id="toolbar">> #shadow-root(open)<div id="toolbar"><div id="start"><cr-icon-button id="sidenavToggle" title="Menu" aria-label="Menu" iron-icon="cr20:menu" aria-expanded="true" role="button" tabindex="0" aria-disabled="false"></cr-icon-button><span id="title"><!--?lit$02748104126$-->D5F1C5BE75754D2065258671002817C2_GAQC_Alert_No._421.pdf</span></div><div id="center"><viewer-page-selector style="--page-length-digits: 1;"></viewer-page-selector><span class="vertical-separator"></span><span id="zoom-controls"><cr-icon-button title="Zoom out" aria-label="Zoom out" iron-icon="pdf:remove" role="button" tabindex="0" aria-disabled="false"></cr-icon-button><input type="text" value="100%" aria-label="Zoom level"><cr-icon-button title="Zoom in" aria-label="Zoom in" iron-icon="pdf:add" role="button" tabindex="0" aria-disabled="false"></cr-icon-button></span><span class="vertical-separator"></span><cr-icon-button id="fit" title="Fit to page" aria-label="Fit to page" iron-icon="pdf:fit-to-height" role="button" tabindex="0" aria-disabled="false"></cr-icon-button><cr-icon-button id="rotate" suppress-rtl-flip="" aria-label="Rotate counterclockwise" title="Rotate counterclockwise" iron-icon="pdf:rotate-left" role="button" tabindex="0" aria-disabled="false"></cr-icon-button><!--?lit$02748104126$--></div><div id="end"><viewer-download-controls id="downloads"></viewer-download-controls><cr-icon-button id="print" title="Print" aria-label="Print" iron-icon="cr:print" role="button" tabindex="0" aria-disabled="false"></cr-icon-button><cr-icon-button id="more" title="More actions" aria-label="More actions" iron-icon="cr:more-vert" role="button" tabindex="0" aria-disabled="false"></cr-icon-button></div></div></viewer-toolbar></body>
While accessing Embed as below getting an exception
frameElement = WebElementFinder.GetElement(Driver, XPATHOFFrame); Driver.SwitchTo().Frame(frameElement); IWebElement elementInsideIframe = Driver.FindElement(By.TagName("embed")); IWebElement shadowHost1 = Driver.FindElement(By.Id("viewer")); ISearchContext shadowRoot1 = shadowHost1.GetShadowRoot(); IWebElement shadowHost2 = shadowRoot1.FindElement(By.Id("toolbar")); ISearchContext shadowRoot2 = shadowHost2.GetShadowRoot(); IWebElement shadowHost3 = Driver.FindElement(By.Id("downloads")); ISearchContext shadowRoot3 = shadowHost3.GetShadowRoot(); IWebElement shadowHost4 = Driver.FindElement(By.Id("download")); ISearchContext shadowRoot4 = shadowHost3.GetShadowRoot(); shadowRoot4.FindElement(By.Id("icon")).Click();
Exception :"no such element: Unable to locate element: {"method":"css selector","selector":"#viewer"