HTML_CodeSniffer icon indicating copy to clipboard operation
HTML_CodeSniffer copied to clipboard

"Point to Element" scrolls to wrong position in iframes

Open jamadam opened this issue 5 years ago • 1 comments

Firefox 66.0.2 Google Chrome 73.0.3683.103

Procedure to reproduce

  1. Open test1.html below.
  2. Open HTML CodeSniffer by bookmarklet.
  3. Open 1st issue. (and click on "Point to Element" to try again)

Expected Behavior

The icon points to the text "line 1" and the scrolltop of iframe body is 0.

Actual Behavior

The icon points to the text "line 1" but the scrolltop of iframe body is 121.

Other information

It seems padding-top:200px; has something to do with the issue.

test1.html

<html lang="ja">
    <title>test1</title>
    <style>
        body {
            padding-top:200px;
        }
        iframe {
            width:100%;
            height:300px;
        }
    </style>
    <body>
        <iframe src="./test2.html" title="Main Content"></iframe>
    </body>
</html>

test2.html

<html lang="ja">
    <title>test2</title>
    <style>
        body {
            background-color:#aaa;
            color:#bbb;
        }
        * {
            box-sizing:border-box;
            font-size:20px;
        }
    </style>
    <body>
        <strong>line 1</strong>
        <br><strong>line 2</strong>
        <br><strong>line 3</strong>
        <br><strong>line 4</strong>
        <br><strong>line 5</strong>
        <br><strong>line 6</strong>
        <br><strong>line 7</strong>
        <br><strong>line 8</strong>
        <br><strong>line 9</strong>
        <br><strong>line 11</strong>
        <br><strong>line 12</strong>
        <br><strong>line 13</strong>
        <br><strong>line 14</strong>
        <br><strong>line 15</strong>
        <br><strong>line 16</strong>
        <br><strong>line 17</strong>
        <br><strong>line 18</strong>
        <br><strong>line 19</strong>
        <br><strong>line 20</strong>
    </body>
</html>

jamadam avatar Apr 15 '19 07:04 jamadam

I can replicate this. The element positioning math needs to be reviewed so that it works correctly for content inside iframes (Roughly in Auditor/HTMLCSAuditor.js line 1978 where targetY is calculated).

ironikart avatar Apr 15 '19 23:04 ironikart