Совместимость браузера Polymer
Я начинаю использовать Polymer 1.0: единственное, что я попробовал, это простой шаблон, подобный этому:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="bower_components/webcomponentsjs/webcomponents.min.js"></script>
<script src="bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
<link rel="import" href="bower_components/polymer/polymer.html"></link>
<link rel="import" href="bower_components/iron-icons/iron-icons.html">
<title>Polymer test1</title>
</head>
<body unresolved>
<dom-module id="pres-test">
<template>
<content></content>
<p>This is my name:<h3>{{name}}</h3></p>
<iron-icon icon="star" hidden="{{!star}}"></iron-icon>
<img src="http://placehold.it/300x100"></img>
</template>
</dom-module>
<script>
Polymer({
is:'pres-test',
properties:{
name:String,
star:Boolean
}
});
</script>
<pres-test name="withStar" star>
<h1>Example1:</h1>
<img src="http://placekitten.com/g/200/180" alt="image"></img>
</pres-test>
<pres-test name="withoutStar">
<h2>Example:</h2>
<img src="http://placesheen.com/100/100"></img>
<p>No star icon :()</p>
</pres-test>
</body>
</html>
Этот код прекрасно работает на Chrome и Opera, за исключением того, что, даже если я не помещу булеву звезду в предварительный тест, она все равно показывает звезду.
В Firefox и IE он просто показывает h1 и img в предварительном тесте.
В Safari кажется, что он не понимает такие теги, как dom-модуль, шаблон или предварительный тест, поскольку сначала он отображает то, что находится в модуле dom, а затем то, что находится в предварительном тесте, без адаптации к переменным.
Я искал совместимость Polymer, но нашел только для версии 0.5.
Я что-то не так делаю, или это просто не совместимо с этими браузерами?