SyntaxError in IE/FF/Safari (not in Chrome) for webcomponents-lite.min.js

[haltersweb]

Description

Error thrown in FF, IE, and Safari (but not in Chrome) when Polymer CLI template site is built and deployed. Blank page is rendered. Error not seen in localhost using 'polymer serve' in any of these browsers.

Live Demo

https://polyapp-c25f2.firebaseapp.com/
and
https://a11ytests-d60ea.firebaseapp.com/

Steps to Reproduce

1. Create templated site following Polymer CLI: Getting Started -- Polycast added g-menu-button and g-toolbar #48 on YouTube using 'polymer init' (https://www.youtube.com/watch?v=pj2lmXVa84U)
2. create Firebase project and run 'firebase init'
3. run 'polymer build'
4. run 'firebase deploy'
5. run 'firebase open' to open the site in Chrome; notice it renders correctly and no error is thrown in console.
6. view the same url in Firefox on PC, IE11 on PC, Safari on Mac; notice the screen is blank and an error is thrown in console.

Expected Results

In browsers other than Chrome page renders correctly and no error is thrown

Actual Results

In browsers other than Chrome page is blank and the following error is thrown:
"SyntaxError: expected expression, got '<' for the file bower_components/webcomponentsjs/webcomponents-lite.min.js

Browsers Affected

• Chrome
• [x ] Firefox
• [? ] Edge
• [x ] Safari 9
• [? ] Safari 8
• [x ] IE 11

Versions

• Polymer: v1.6.1
• webcomponents: v1.7.9

[TimvdLippe]

Since Chrome does not require the polyfill, it will not try to load it. However, the other browsers are loading the polyfill which falls back to the index.html. Since the script was loaded and expects a javascript file as response, but instead encounters html content, it throws the SyntaxError.

[haltersweb]

Thank you Tim.

I assumed 'polymer build' included the polyfill in the build.

Am I correct or is there a step I am missing to ensure compatibility with other browsers.

[TimvdLippe]

@haltersweb You need to include the dependency by for example specifying it in the polymer.json, see the polymer.json in the starter-kit: https://github.com/PolymerElements/polymer-starter-kit/blob/master/polymer.json#L17

[haltersweb]

@TimvdLippe this was already specified in my polymer.json. Is there something else I am missing?

Here is my polymer.json:

{
"entrypoint": "index.html",
"shell": "src/my-app.html",
"fragments": [
"src/my-view1.html",
"src/my-view2.html",
"src/my-view3.html",
"src/my-view4.html",
"src/my-view404.html"
],
"sourceGlobs": [
"src/**/*",
"images/**/*",
"bower.json"
],
"includeDependencies": [
"manifest.json",
"bower_components/webcomponentsjs/webcomponents-lite.min.js"
]
}

[haltersweb]

Interestingly I just looked in my build folder and manifest.json is also not being added during the build even though it is in the "includeDependencies" array as well.

[haltersweb]

I did some more sleuthing and it looks like this is a known issue. See reference to issue above.

[haltersweb]

Just fixed with v0.16.0