GreenPolyProducts/polymer
5
0
Fork 0
mirror of https://github.com/Polymer/polymer.git synced 2025-02-25 18:55:30 -06:00
Code Issues Packages Projects Releases Wiki Activity

Rename html-fn to html-tag

Browse Source 
Add tests
Add a `Polymer.html = Polymer.html` line to `polymer.html` and
`polymer-element.html` for modulizer exporting in Polymer 3.
This commit is contained in:
Daniel Freedman 2017-12-06 17:07:26 -08:00
parent 5c91985061
commit 02c06aa3b8
7 changed files with 128 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
lib/mixins/element-mixin.html
View File

@ -14,7 +14,6 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<link rel="import" href="../utils/case-map.html">
<link rel="import" href="../utils/style-gather.html">
<link rel="import" href="../utils/resolve-url.html">
<link rel="import" href="../utils/html-fn.html">
<link rel="import" href="../elements/dom-module.html">
<link rel="import" href="property-effects.html">

0
lib/utils/html-fn.html → lib/utils/html-tag.html
View File

5
polymer-element.html
View File

@ -8,6 +8,8 @@ Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<link rel="import" href="lib/mixins/element-mixin.html">
<!-- import html-tag to export html -->
<link rel="import" href="lib/utils/html-tag.html">
<script>
(function() {
'use strict';
@ -35,5 +37,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
* @extends {HTMLElement}
*/
Polymer.Element = Element;
// NOTE: this is here for modulizer to export `html` for the module version of this file
Polymer.html = Polymer.html;
})();
</script>

5
polymer.html
View File

@ -19,7 +19,12 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<link rel="import" href="lib/elements/custom-style.html">
<!-- bc behaviors -->
<link rel="import" href="lib/legacy/mutable-data-behavior.html">
<!-- import html-tag to export html -->
<link rel="import" href="lib/util/html-tag.html">
<script>
// bc
Polymer.Base = Polymer.LegacyElementMixin(HTMLElement).prototype;
// NOTE: this is here for modulizer to export `html` for the module version of this file
Polymer.html = Polymer.html;
</script>

3
test/runner.html
View File

@ -75,6 +75,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
'unit/render-status.html',
'unit/dir.html',
'unit/shady-unscoped-style.html',
'unit/html-tag.html'
// 'unit/multi-style.html'
];
@ -115,7 +116,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
// ce + sd becomes a single test iteration.
matrix.push('wc-ce=true&wc-shadydom=true');
}
// economize testing by testing css shimming
// only against 1 environment (native or polyfill).
if (window.CSS && CSS.supports && CSS.supports('box-shadow', '0 0 0 var(--foo)')) {

4
test/smoke/html-fn.html → test/smoke/html-tag.html
View File

@ -1,4 +1,5 @@
<!--
<!DOCTYPE html>
<!--
@license
Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
@ -7,7 +8,6 @@ The complete set of contributors may be found at http://polymer.github.io/CONTRI
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<!DOCTYPE html>
<html>
<head>
<script src="../../../webcomponentsjs/webcomponents-lite.js"></script>

114
test/unit/html-tag.html Normal file
View File

@ -0,0 +1,114 @@
<!doctype html>
<!--
@license
Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<html>
<head>
<meta charset="utf-8">
<script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
<script src="../../../web-component-tester/browser.js"></script>
<link rel="import" href="../../polymer.html">
</head>
<body>
<script>
suite('html function', function() {
test('html makes an HTML template', function() {
let t = Polymer.html``;
assert.instanceOf(t, HTMLTemplateElement);
});
test('template output has elements', function() {
let t = Polymer.html`<div><span></span></div><!-- hi -->`;
assert(t.content.querySelector('div'));
assert(t.content.querySelector('span'));
assert.instanceOf(t.content.lastChild, Comment);
});
test('escaping works as expected', function() {
let t = Polymer.html`<span>\f\o\o</span>`;
assert.equal(t.innerHTML, '<span>\\f\\o\\o</span>');
});
test('variables work', function() {
let a = 3;
let b = 'foo';
let t = Polymer.html`<div>${a} ${b}</div>`;
let inst = document.createElement('div');
inst.appendChild(t.content.cloneNode(true));
assert.equal(inst.textContent, `${a} ${b}`);
});
test('template variables only include the template contents', function() {
let t1 = Polymer.html`<div></div>`;
let t2 = Polymer.html`<span>${t1}</span>`;
assert.equal(t2.innerHTML, '<span><div></div></span>');
});
});
suite('Polymer + html fn', function() {
suiteSetup(function() {
class HtmlFn extends Polymer.Element {
static get is() {return 'html-fn';}
static get template() {
return Polymer.html`
<style>
:host {
display: block;
}
</style>
<div id="child">
[[databoundProperty]]
</div>
`;
}
static get properties() {
return {
databoundProperty: String
};
}
ready() {
super.ready();
this.databoundProperty = 'first';
}
}
customElements.define(HtmlFn.is, HtmlFn);
class HtmlFnSub extends HtmlFn {
static get is() {return 'html-fn-sub';}
static get template() {
return Polymer.html`
<div id="super">
${super.template}
</div>
`;
}
ready() {
super.ready();
this.databoundProperty = 'second';
}
}
customElements.define(HtmlFnSub.is, HtmlFnSub);
});
test('Polymer elements can use html fn', function () {
let el = document.createElement('html-fn');
document.body.appendChild(el);
assert(el.shadowRoot);
assert.equal(el.$.child.textContent.trim(), 'first');
});
test('subclass elements can embed the superclass template', function() {
let el = document.createElement('html-fn-sub');
document.body.appendChild(el);
assert(el.$.super);
assert(el.$.child);
assert.equal(el.$.child.textContent.trim(), 'second');
});
});
</script>
</body>
</html>