54 lines
1.8 KiB
HTML
54 lines
1.8 KiB
HTML
|
<!doctype html>
|
||
|
|
<!--
|
||
|
|
@license
|
||
|
|
Copyright (c) 2014 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>
|
||
|
|
<title></title>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<script src="../webcomponents-loader.js"></script>
|
||
|
|
<script src="../../web-component-tester/browser.js"></script>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<x-foo>plain</x-foo>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
test('smoke', function(done) {
|
||
|
|
class XFoo extends HTMLElement {
|
||
|
|
connectedCallback() {
|
||
|
|
this.textContent = 'x-foo!';
|
||
|
|
}
|
||
|
|
}
|
||
|
|
window.customElements.define('x-foo', XFoo);
|
||
|
|
assert.equal(document.querySelector('x-foo').textContent, 'x-foo!',
|
||
|
|
'x-foo must have custom text');
|
||
|
|
|
||
|
|
class XZot extends HTMLElement {
|
||
|
|
connectedCallback() {
|
||
|
|
this.textContent = 'x-zot!';
|
||
|
|
}
|
||
|
|
}
|
||
|
|
window.customElements.define('x-zot', XZot);
|
||
|
|
|
||
|
|
var xfoo = document.querySelector('x-foo');
|
||
|
|
var root = xfoo.attachShadow({mode: 'open'});
|
||
|
|
var xzot = document.createElement('x-zot');
|
||
|
|
|
||
|
|
var handler = function() {
|
||
|
|
assert.equal(xzot.textContent, 'custom!', 'x-zot in shadow root must have custom text');
|
||
|
|
done();
|
||
|
|
}
|
||
|
|
var ob = new MutationObserver(handler);
|
||
|
|
ob.observe(root, {childList: true, subtree: true});
|
||
|
|
root.appendChild(xzot);
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|