Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Cannot define an element in the main document (Firefox and Internet explorer) #1850

Closed
plequang opened this issue Jun 12, 2015 · 3 comments
Closed

Cannot define an element in the main document (Firefox and Internet explorer) #1850

plequang opened this issue Jun 12, 2015 · 3 comments

Comments

@plequang
Copy link

While migrating tests from app-router to Polymer 1.0, I've noticed that it is not possible to define an element and use this element in the main document.

The following simple example fails under Firefox and Internet Explorer, because 'Polymer' is not defined :

<!DOCTYPE html>
<html>
    <head>
        <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>
        <link rel="import" href="bower_components/polymer/polymer.html">
        <title>Polymer Tests</title>
    </head>
    <body>
        <dom-module id="x-element">
            <template>
                Test element.
            </template>
            <script>
                Polymer({
                    is: 'x-element'
                });
            </script>
        </dom-module>
        <x-element></x-element>
    </body>
</html>

It works with Chrome though.

Test page is also available here http://plequang.github.io/polymer-tests/

I thought it was a HTMLImport polyfill problem, but the same example with Polymer 0.5 and webcomponentjs 0.7.3 is working correctly.

Is this a bug, or is this way of defining elements prohibited with Polymer 1.0 (meaning you should always define elements in other files than the main document) ?

Thanks
@plequang
Copy link
Author

I've just seen the sample jsbin mentionned here https://github.com/Polymer/polymer/blob/master/CONTRIBUTING.md#filing-bugs

Everything works if I use

<script>
    HTMLImports.whenReady(function () {
        Polymer({
            is: 'x-element'
        });
    });
</script>

Maybe it would be worth mentionning this in the documentation ?

@arthurevans
Copy link

This limitation is documented here:

https://www.polymer-project.org/1.0/docs/devguide/registering-elements.html

This is, as you guessed, a limitation of the polyfill. Polymer 0.5 worked around this at the cost of additional complexity, so Polymer 1.0 doesn't do the same workaround.

This could be clearer in the docs (and we should cover using whenReady), so I'll turn this into a doc issue.

@arthurevans arthurevans mentioned this issue Jun 12, 2015
Closed
@arthurevans
Copy link

This issue was moved to Polymer/old-docs-site#1187

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@arthurevans @plequang