iframe-resizer icon indicating copy to clipboard operation
iframe-resizer copied to clipboard

Name anchors in iframe refresh entire parent page

Open hbcondo opened this issue 5 years ago • 4 comments

Describe the bug Name anchors present in a web page loaded into an iframe are reloading the entire parent page when clicked on.

To Reproduce Steps to reproduce the behavior:

  1. Add an iframe to a parent page where the contents of the iframe contain at least one name anchor.
  2. Click on the name anchor
  3. Entire parent page is refreshed and iframe content now displays entire parent page

Expected behavior Iframe should scroll to content where name anchor is located in framed page; no page refreshes should occur.

Desktop (please complete the following information):

  • OS: Windows
  • Browser: Chrome
  • Version 80.0.3987.149 (Official Build) (64-bit)

Additional context This seems similar to issue #68 but that was filed years ago and is closed. Sounds like iframe-resizer was updated to solve for this w/o requiring any extra code but for some reason we are experiencing this issue. The name anchors contained in our iframe content are relative with no targets. An example name anchor contained in our iframe:

<a href="#toc">Table of Contents</a> <div id="toc">Table of Contents</div>

hbcondo avatar Mar 29 '20 20:03 hbcondo

Have you set theinPageLinks option? This is not on by default.

https://github.com/davidjbradshaw/iframe-resizer/blob/master/docs/parent_page/options.md#inpagelinks

davidjbradshaw avatar Mar 30 '20 13:03 davidjbradshaw

Yes, but with inPageLinks set to true the iframe does not scroll to the name anchor when clicked but at least the page doesn't refresh. This is the logger output as it appears to try and scroll but doesn't:

[iFrameSizer][idiffContent] Trigger event: Mouse Down iframeResizer.contentWindow.js:169 [iFrameSizer][idiffContent] No change in size detected iframeResizer.contentWindow.js:169 [iFrameSizer][idiffContent] Trigger event: Mouse Up iframeResizer.contentWindow.js:169 [iFrameSizer][idiffContent] Moving to in page link (#ib6cbc424641a4616ac5945a60bcb8407_16) at x: 8 y: 3582 iframeResizer.contentWindow.js:169 [iFrameSizer][idiffContent] Sending message to host page (idiffContent:3582:8:scrollToOffset) iframeResizer.js:142 [iFrameSizer][Host page: idiffContent] Received: [iFrameSizer]idiffContent:3582:8:scrollToOffset iframeResizer.js:142 [iFrameSizer][Host page: idiffContent] Get page position: 0,0 iframeResizer.js:142 [iFrameSizer][Host page: idiffContent] Reposition requested from iFrame (offset x:257 y:-1286) iframeResizer.js:142 [iFrameSizer][Host page: idiffContent] Set page position: 265,2296 iframeResizer.js:142 [iFrameSizer][Host page: idiffContent] -- iframeResizer.contentWindow.js:169 [iFrameSizer][idiffContent] No change in size detected

hbcondo avatar Mar 30 '20 16:03 hbcondo

Well the log output is at least correct. Does the example work for you? just wondering if something else on your page is stopping the scrolling?

davidjbradshaw avatar Mar 30 '20 17:03 davidjbradshaw

The example appears to work on our browsers (Chrome, Safari) but I'm not sure if it exemplifies our issue as its iframe contents are small with no scrollbar. Clicking on the bottom link when the height calculation method is set to max does scroll down but that's the parent page. Our issue is that the iframe content, which has long content and renders a scrollbar, does not scroll when a name anchor inside that iframe content is clicked.

image

hbcondo avatar Mar 30 '20 17:03 hbcondo