62 lines
2.3 KiB
HTML
62 lines
2.3 KiB
HTML
<!doctype html>
|
|
<!--
|
|
@license
|
|
Copyright (c) 2016 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>Integration Test</title>
|
|
<script src="../webcomponents-loader.js"></script>
|
|
<script src="../../web-component-tester/browser.js"></script>
|
|
<link rel="import" href="imports/simple-element.html">
|
|
</head>
|
|
<body>
|
|
|
|
<!-- Don't break this into multiple lines or you'll have to count text nodes -->
|
|
<simple-element id="basic"><span>Light DOM</span></simple-element>
|
|
|
|
<script>
|
|
suite('integration', function() {
|
|
var el;
|
|
|
|
setup(function() {
|
|
el = document.querySelector('#basic');
|
|
});
|
|
|
|
test('element is imported & upgraded', function() {
|
|
assert.equal(el.bestName, 'batman',
|
|
'doesn\'t have property set in constructor');
|
|
});
|
|
|
|
test('element has shadow DOM content', function() {
|
|
var shadowRoot = el.shadowRoot;
|
|
|
|
assert.ok(shadowRoot, 'does not have a shadow root');
|
|
assert.equal(shadowRoot.querySelector('p').textContent, 'Shadow DOM',
|
|
'does not have <p> in the shadow dom');
|
|
assert.equal(getComputedStyle(shadowRoot.querySelector('p')).color, 'rgb(255, 0, 0)',
|
|
'does not style <p> in the shadow dom');
|
|
});
|
|
|
|
test('element has distributed content', function() {
|
|
var slot = el.shadowRoot.querySelector('slot');
|
|
assert.ok(slot, 'does not have a slot');
|
|
|
|
var distributedNodes = slot.assignedNodes()
|
|
assert.equal(distributedNodes.length, 1,
|
|
'does not have exactly one element distributed');
|
|
assert.equal(distributedNodes[0].textContent, 'Light DOM',
|
|
'does not have the right content distributed');
|
|
assert.equal(getComputedStyle(distributedNodes[0]).color, 'rgb(0, 0, 255)',
|
|
'does not style light dom');
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|