UNPKG

@polymer/polymer

Version:

The Polymer library makes it easy to create your own web components. Give your element some markup and properties, and then use it on a site. Polymer provides features like dynamic templates and data binding to reduce the amount of boilerplate you need to

110 lines (96 loc) 2.79 kB
<!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="../../../web-component-tester/browser.js"></script> <script src="../../../webcomponentsjs/webcomponents-lite.js"></script> <script> /* global origOwnProps:true */ window.origOwnProps = Object.getOwnPropertyNames(window).reduce(function(props, prop) { return props[prop] = true && props; }, {}); </script> <link rel="import" href="../../polymer.html"> <body> <!-- Exercise the core features of Polymer --> <dom-module id="shared-styles"> <template strip-whitespace> <style>:host{ --foo: var(--bar); };</style> </template> </dom-module> <dom-module id="global-test"> <template strip-whitespace> <style include="shared-styles">:host{ --foo: var(--bar); };</style> <div class$="{{stuff.is.here}}">{{bindings(are, cool)}}</div> </template> <script> HTMLImports.whenReady(function() { Polymer({ is: 'global-test', properties: { foo: { notify: true, reflectToAttribute: true, observer: 'observeFoo', value: 'foo' } }, observers: ['observeFooDeep(foo.*)'], hostAttributes: { tabIndex: 0 }, listeners: { tap: 'handleTap' }, observeFooDeep() {}, observeFoo() {} }); }); </script> </dom-module> <global-test></global-test> <script> suite('globals', function() { var expected = { origOwnProps: true, // Test harness a11ySuite: true, assert: true, expect: true, run: true, fixture: true, replace: true, stub: true, // Polymer Polymer: true, currentImport: true, JSCompiler_renameProperty: true, // weird safari + selenium globals alert: true, confirm: true, prompt: true, // weird FF globals XULElement: true }; test('check global leakage', function() { // Only run on native ES6 browsers, to avoid transpiler globals if (!window._classCallCheck) { var newProps = Object.getOwnPropertyNames(window).filter(function(prop) { return !origOwnProps[prop] && !expected[prop]; }); assert.equal(newProps.length, 0, 'new globals added: \n' + newProps.sort().join('\n')); } }); }); </script> </body> </html>