webdash-readme-preview
Version:
Preview your README.md straight from the dashboard
122 lines (101 loc) • 4.16 kB
HTML
<!--
@license
Copyright (c) 2015 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">
<title>demo-snippet tests</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
<script src="../../web-component-tester/browser.js"></script>
<link rel="import" href="../demo-snippet.html">
<link rel="import" href="simple-button.html">
</head>
<body>
<!--
*** Important! ***
You'll notice that these tests don't use test-fixture. That's because
there's a problem stamping nested templates in IE/Safari 8. This
should eventually be patched in webcomponents.js, but in the meantime
we're going to run these tests "the old way".
This is relevant because this means that you, as the test writer,
need to remember that an element's state is maintained between tests.
If you don't want this, either use a new element, or clean up after
your test.
-->
<demo-snippet id="emptyDemo"></demo-snippet>
<demo-snippet id="nativeDemo">
<template>
<input disabled>
</template>
</demo-snippet>
<demo-snippet id="customDemo">
<template>
<simple-button value="batman"></simple-button>
</template>
</demo-snippet>
<demo-snippet id="demoWithAttributes">
<template>
<input disabled type="date">
</template>
</demo-snippet>
<script>
suite('display', function() {
var emptyHeight;
setup(function() {
var emptyDemo = document.getElementById('emptyDemo');
emptyHeight = emptyDemo.getBoundingClientRect().height;
});
test('can render native elements', function(done) {
Polymer.Base.async(function() {
var element = document.getElementById('nativeDemo');
var rect = element.getBoundingClientRect();
expect(rect.height).to.be.greaterThan(emptyHeight);
// The demo is rendered in the light dom, so it should exist, and
// it should respect the demo element's attributes, and not make up
// new ones.
var input = element.querySelector('input')
expect(input).to.be.ok;
expect(input.disabled).to.be.true;
var markdownElement = element.$.marked;
expect(markdownElement.markdown).to.be.equal('```\n\n<input disabled>\n\n```');
done();
}, 1);
});
test('can render custom elements', function(done) {
Polymer.Base.async(function() {
var element = document.getElementById('customDemo');
var rect = element.getBoundingClientRect();
expect(rect.height).to.be.greaterThan(emptyHeight);
// The demo is rendered in the light dom, so it should exist, and
// it should respect the demo element's attributes, and not make up
// new ones.
var button = element.querySelector('simple-button')
expect(button).to.be.ok;
expect(button.value).to.be.equal('batman');
var markdownElement = element.$.marked;
expect(markdownElement.markdown).to.be.equal('```\n\n<simple-button value="batman"></simple-button>\n\n```');
done();
}, 1);
});
});
suite('parsing', function() {
test('preserves attributes', function(done) {
Polymer.Base.async(function() {
var element = document.getElementById('demoWithAttributes');
var markdownElement = element.$.marked;
expect(markdownElement.markdown).to.be.equal('```\n\n<input disabled type="date">\n\n```');
done();
}, 1);
});
});
</script>
</body>
</html>