Open Bug 1229966 Opened 9 years ago Updated 3 years ago

Parsing of contents of <script> ends mid file (presumably) due to markdown code ticks in comment making it appear unterminated.

Categories

(Core :: DOM: HTML Parser, defect, P5)

Product:
Core
Component:
DOM: HTML Parser
Version:
42 Branch
Platform:
x86_64
macOS
Type:
defect

Tracking

()

Status:
UNCONFIRMED

People

(Reporter: carl, Unassigned)

Details

Attachments

(1 file)

Screen Shot 2015-12-02 at 3.37.00 PM.png
24.40 KB, image/png
Details 
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_1) AppleWebKit/601.2.7 (KHTML, like Gecko) Version/9.0.1 Safari/601.2.7

Steps to reproduce:

A Polymer project that was rendering correctly in Chrome and Safari had a broken custom element in Firefox 42 (Standard and Developer flavours). 


Actual results:

Console mentioned an unterminated comment and a 404 to a file that existed in a dependency for said custom element.

I followed the unterminated comment crumb trail to the file mentioned (the comment was terminated). After some playing around I found out that the minimal action needed for the file to be parsed was deleting lines 41-49 (not 41-43, or 47-49). After this change the file below was parsed, and everything was happiness.

https://github.com/PolymerElements/iron-overlay-behavior/blob/2181b09a23658fede08e6c4d5f30e98227953506/iron-overlay-behavior.html

Here's the relevant bit (the end) of the file in question as it met a premature end:

### Backdrop

Set the `with-backdrop` attribute to display a backdrop behind the overlay. The backdrop is
appended to `<body><script type='text/javascript' id="__bs_script__">//<![CDATA[
    document.write("<script async src='/browser-sync/browser-sync-client.1.9.2.js'><\/script>".replace(/HOST/g, location.hostname).replace(/PORT/g, location.port));
//]]>
//# sourceURL=http://localhost:9000/bower_components/iron-overlay-behavior/iron-overlay-behavior.html.js


Expected results:

The custom element should have rendered properly.
OS: Unspecified → Mac OS X
Hardware: Unspecified → x86_64
Hardware: x86_64 → x86
Hardware: x86 → x86_64
Can you provide the generated HTML the broken version? I suspect a difference in parsing rules for HTML <script> elements, but I want to have the exact testcase so an engineer has a good thing to work with.
Component: Untriaged → HTML: Parser
Flags: needinfo?(carl)
Product: Firefox → Core
via: 

view-source:data:text/javascript;charset=utf-8,%0A%0A%2F**%0AUse%20`Polymer.IronOverlayBehavior`%20to%20implement%20an%20element%20that%20can%20be%20hidden%20or%20shown%2C%20and%20displays%0Aon%20top%20of%20other%20content.%20It%20includes%20an%20optional%20backdrop%2C%20and%20can%20be%20used%20to%20implement%20a%20variety%0Aof%20UI%20controls%20including%20dialogs%20and%20drop%20downs.%20Multiple%20overlays%20may%20be%20displayed%20at%20once.%0A%0A%23%23%23%20Closing%20and%20canceling%0A%0AA%20dialog%20may%20be%20hidden%20by%20closing%20or%20canceling.%20The%20difference%20between%20close%20and%20cancel%20is%20user%0Aintent.%20Closing%20generally%20implies%20that%20the%20user%20acknowledged%20the%20content%20on%20the%20overlay.%20By%20default%2C%0Ait%20will%20cancel%20whenever%20the%20user%20taps%20outside%20it%20or%20presses%20the%20escape%20key.%20This%20behavior%20is%0Aconfigurable%20with%20the%20`no-cancel-on-esc-key`%20and%20the%20`no-cancel-on-outside-click`%20properties.%0A`close%28%29`%20should%20be%20called%20explicitly%20by%20the%20implementer%20when%20the%20user%20interacts%20with%20a%20control%0Ain%20the%20overlay%20element.%20When%20the%20dialog%20is%20canceled%2C%20the%20overlay%20fires%20an%20'iron-overlay-canceled'%0Aevent.%20Call%20`preventDefault`%20on%20this%20event%20to%20prevent%20the%20overlay%20from%20closing.%0A%0A%23%23%23%20Positioning%0A%0ABy%20default%20the%20element%20is%20sized%20and%20positioned%20to%20fit%20and%20centered%20inside%20the%20window.%20You%20can%0Aposition%20and%20size%20it%20manually%20using%20CSS.%20See%20`Polymer.IronFitBehavior`.%0A%0A%23%23%23%20Backdrop%0A%0ASet%20the%20`with-backdrop`%20attribute%20to%20display%20a%20backdrop%20behind%20the%20overlay.%20The%20backdrop%20is%0Aappended%20to%20`<body><script%20type%3D'text%2Fjavascript'%20id%3D"__bs_script__">%2F%2F<![CDATA[%0A%20%20%20%20document.write%28"<script%20async%20src%3D'%2Fbrowser-sync%2Fbrowser-sync-client.1.9.2.js'><\%2Fscript>".replace%28%2FHOST%2Fg%2C%20location.hostname%29.replace%28%2FPORT%2Fg%2C%20location.port%29%29%3B%0A%2F%2F]]>%0A%2F%2F%23%20sourceURL%3Dhttp%3A%2F%2Flocalhost%3A9000%2Fbower_components%2Firon-overlay-behavior%2Firon-overlay-behavior.html.js%0A



here's what the source is displayed as:



/**
Use `Polymer.IronOverlayBehavior` to implement an element that can be hidden or shown, and displays
on top of other content. It includes an optional backdrop, and can be used to implement a variety
of UI controls including dialogs and drop downs. Multiple overlays may be displayed at once.

### Closing and canceling

A dialog may be hidden by closing or canceling. The difference between close and cancel is user
intent. Closing generally implies that the user acknowledged the content on the overlay. By default,
it will cancel whenever the user taps outside it or presses the escape key. This behavior is
configurable with the `no-cancel-on-esc-key` and the `no-cancel-on-outside-click` properties.
`close()` should be called explicitly by the implementer when the user interacts with a control
in the overlay element. When the dialog is canceled, the overlay fires an 'iron-overlay-canceled'
event. Call `preventDefault` on this event to prevent the overlay from closing.

### Positioning

By default the element is sized and positioned to fit and centered inside the window. You can
position and size it manually using CSS. See `Polymer.IronFitBehavior`.

### Backdrop

Set the `with-backdrop` attribute to display a backdrop behind the overlay. The backdrop is
appended to `<body><script type='text/javascript' id="__bs_script__">//<![CDATA[
    document.write("<script async src='/browser-sync/browser-sync-client.1.9.2.js'><\/script>".replace(/HOST/g, location.hostname).replace(/PORT/g, location.port));
//]]>
//# sourceURL=http://localhost:9000/bower_components/iron-overlay-behavior/iron-overlay-behavior.html.js
Flags: needinfo?(carl)
Here's what console says:

15:45:57.389 SyntaxError: unterminated comment1 data:%0A%0A%2F**%0AUse%20%60Polymer.IronOverlayBehavior%60%20to%20implement%20an%20element%20that%20can%20be%20hidden%20or%20shown%2C%20and%20displays%0Aon%20top%20of%20other%20content.%20It%20includes%20an%20optional%20backdrop%2C%20and%20can%20be%20used%20to%20implement%20a%20variety%0Aof%20UI%20controls%20including%20dialogs%20and%20drop%20downs.%20Multiple%20overlays%20may%20be%20displayed%20at%20once.%0A%0A%23%23%23%20Closing%20and%20canceling%0A%0AA%20dialog%20may%20be%20hidden%20by%20closing%20or%20canceling.%20The%20difference%20between%20close%20and%20cancel%20is%20user%0Aintent.%20Closing%20generally%20implies%20that%20the%20user%20acknowledged%20the%20content%20on%20the%20overlay.%20By%20default%2C%0Ait%20will%20cancel%20whenever%20the%20user%20taps%20outside%20it%20or%20presses%20the%20escape%20key.%20This%20behavior%20is%0Aconfigurable%20with%20the%20%60no-cancel-on-esc-key%60%20and%20the%20%60no-cancel-on-outside-click%60%20properties.%0A%60close()%60%20should%20be%20called%20explicitly%20by%20the%20implementer%20when%20the%20user%20interacts%20with%20a%20control%0Ain%20the%20overlay%20element.%20When%20the%20dialog%20is%20canceled%2C%20the%20overlay%20fires%20an%20'iron-overlay-canceled'%0Aevent.%20Call%20%60preventDefault%60%20on%20this%20event%20to%20prevent%20the%20overlay%20from%20closing.%0A%0A%23%23%23%20Positioning%0A%0ABy%20default%20the%20element%20is%20sized%20and%20positioned%20to%20fit%20and%20centered%20inside%20the%20window.%20You%20can%0Aposition%20and%20size%20it%20manually%20using%20CSS.%20See%20%60Polymer.IronFitBehavior%60.%0A%0A%23%23%23%20Backdrop%0A%0ASet%20the%20%60with-backdrop%60%20attribute%20to%20display%20a%20backdrop%20behind%20the%20overlay.%20The%20backdrop%20is%0Aappended%20to%20%60%3Cbody%3E%3Cscript%20type%3D'text%2Fjavascript'%20id%3D%22__bs_script__%22%3E%2F%2F%3C!%5BCDATA%5B%0A%20%20%20%20document.write(%22%3Cscript%20async%20src%3D'%2Fbrowser-sync%2Fbrowser-sync-client.1.9.2.js'%3E%3C%5C%2Fscript%3E%22.replace(%2FHOST%2Fg%2C%20location.hostname).replace(%2FPORT%2Fg%2C%20location.port))%3B%0A%2F%2F%5D%5D%3E%0A%2F%2F%23%20sourceURL%3Dhttp%3A%2F%2Flocalhost%3A9000%2Fbower_components%2Firon-overlay-behavior%2Firon-overlay-behavior.html.js%0A:3:0
I suppose my initial ticket was a little off in "expected" - the element renders, but it has no behaviour. It's supposed to be hidden and initiated when a specific type of button is active pop up as a modal overlay.
If you want to see it yourself, clone https://github.com/ucla/heimdallr/tree/polymer-1.1 and run the grunt command once you have dependencies setup. It'll show up @ localhost:9000/bol-full-time-query-results.html
(In reply to carl from comment #2)
> view-source:data:text/javascript;charset=utf-8

This is filed under the HTML Parser, but the data: URL has the JavaScript type and the error seen in the screenshot comes from the JS parser:
https://mxr.mozilla.org/mozilla-central/source/js/src/js.msg#338

Also, https://github.com/PolymerElements/iron-overlay-behavior/blob/2181b09a23658fede08e6c4d5f30e98227953506/iron-overlay-behavior.html shows different stuff under the "Backdrop" markdown heading than what's cited in the bug report.

Is the project showing the bug using an out-of-date copy of iron-overlay-behavior.html or accidentally preprocessing the examples within documentation at build time?

It would be good to have a test case that's more minimized than having to clone and run a random grunt-based project locally. (Stuff under ucla likely isn't malware, but still.)
No, it's not using an out of date version, bower update was run / I recreated it from scratch. There is some processing going on via Polymer, but all other browsers are fine with the same build script so it seems to be a FF specific issue.

Bower and NPM packages are all public packages, and the grunt build script is pretty simple (it's a fork from Google's Yeoman generator-polymer). You could always run it in a VM if paranoid.

Someone else chimed in with the same issue on https://github.com/PolymerElements/iron-overlay-behavior/issues/59#issuecomment-163673017
Hi guys,

I experimented the issue yesterday. I did quick tests trying to run my component without BrowserSync (used gulp-connect instead) and I can't reproduce the error. I guess BrowserSync is intercepting something in the comment to add its script and that causes the "unterminated comment" failure in the console. 

After few searches, this issue has been raised here : https://github.com/PolymerElements/iron-overlay-behavior/issues/22
I guess this issue can be closed as it's not a Firefox issue.

Bulk-downgrade of unassigned, untouched DOM/Storage bug's priority.

If you have reason to believe, this is wrong, please write a comment and ni :jstutte.

Severity: normal → S4
Priority: -- → P5
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: