Scripts imported from templates in other documents that got there via an innerHTML setter do not run

RESOLVED INVALID

Status

()

Core
DOM: Core & HTML
RESOLVED INVALID
a year ago
a year ago

People

(Reporter: matthew, Unassigned, NeedInfo)

Tracking

47 Branch
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(3 attachments)

629 bytes, application/zip
Details
22 bytes, application/x-javascript
Details
605 bytes, text/html
Details
(Reporter)

Description

a year ago
Created attachment 8772840 [details]
example.zip

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.103 Safari/537.36

Steps to reproduce:

1. Created a new document using document.implementation.createHTMLDocument
2. Created a template inside that document with a script.
3. Imported that template into the main document using document.importNode
4. Gave the script a src and inserted it into the main document.


Actual results:

Nothing.


Expected results:

The script should have executed and the script's onload event should have fired.

Comment 1

a year ago
Created attachment 8773029 [details]
foo.js

Comment 2

a year ago
Created attachment 8773031 [details]
example.html

Updated

a year ago
Component: Untriaged → DOM: Core & HTML
Product: Firefox → Core
Boris, is this a bug in Gecko?
Flags: needinfo?(bzbarsky)
Hmm.  So the relevant spec here is starting at https://w3c.github.io/DOM-Parsing/#dom-element-innerhtml which calls into https://w3c.github.io/DOM-Parsing/#dfn-fragment-parsing-algorithm which calls into https://html.spec.whatwg.org/multipage/syntax.html#html-fragment-parsing-algorithm which starts running the parser.  We see the <template> tag, enter https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intemplate then see the <script> tag and process at as if in the "in head" insertion mode, per spec.  That lands us in https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inhead where we see the <script> start tag token and run the relevant steps.  Step 4 is:

  If the parser was originally created for the HTML fragment parsing algorithm,
  then mark the script element as "already started". (fragment case)

So after this point this script will never execute.  So as far as I can tell, we're doing exactly what the spec says here.  Anne, am I missing something?
Flags: needinfo?(bzbarsky) → needinfo?(annevk)
Summary: Scripts imported from templates in other documents do not load → Scripts imported from templates in other documents that got there via an innerHTML setter do not run

Comment 5

a year ago
Yeah, this looks like a bug in Chrome. No other browser does this.
Flags: needinfo?(annevk)
Marking invalid.  I went to file a Chromium issue on this, then discovered one has been filed since late 2015 and there is a patch under review as of a week or two ago.  See https://bugs.chromium.org/p/chromium/issues/detail?id=572693
Status: UNCONFIRMED → RESOLVED
Last Resolved: a year ago
Resolution: --- → INVALID
(Reporter)

Comment 7

a year ago
Thanks for the explanation. This doesn't seem intuitive though, this means you can't have scripts within templates? I thought the point of templates was to template things.
You can have <script> within templates.  What you can't do is use the innerHTML setter to get runnable scripts.

Just like you can have <div><script></script></div> and the script will run, but if you start with an empty <div> and set its innerHTML to "<script></script>" the script will NOT run.  That is, the weird thing here is innerHTML, not templates.
(Reporter)

Comment 9

a year ago
Ah, so the problem is where I set the new document's body. I did it this way because it emulates what the HTML Imports polyfill does, so there's a bug in that polyfill.

Thanks!
Hmm.  Which polyfill is this?  Sounds like we should work with the authors to get it fixed...
Flags: needinfo?(matthew)
(Reporter)

Comment 11

a year ago
https://github.com/webcomponents/webcomponentsjs

Here is where they set the innerHTML: https://github.com/webcomponents/webcomponentsjs/blob/master/src/HTMLImports/importer.js#L146

I filed a bug with them: https://github.com/webcomponents/webcomponentsjs/issues/581
You need to log in before you can comment on or make changes to this bug.