| OLD | NEW |
| 1 // Copyright (c) 2015, the Dart project authors. Please see the AUTHORS file | 1 // Copyright (c) 2015, the Dart project authors. Please see the AUTHORS file |
| 2 // for details. All rights reserved. Use of this source code is governed by a | 2 // for details. All rights reserved. Use of this source code is governed by a |
| 3 // BSD-style license that can be found in the LICENSE file. | 3 // BSD-style license that can be found in the LICENSE file. |
| 4 @TestOn('browser') |
| 4 library web_components.test.custom_element_test; | 5 library web_components.test.custom_element_test; |
| 5 | 6 |
| 6 import 'dart:async'; | 7 import 'dart:async'; |
| 7 import 'dart:html'; | 8 import 'dart:html'; |
| 8 import 'package:unittest/html_config.dart'; | 9 import 'package:test/test.dart'; |
| 9 import 'package:unittest/unittest.dart'; | |
| 10 import 'package:web_components/web_components.dart'; | 10 import 'package:web_components/web_components.dart'; |
| 11 | 11 |
| 12 @CustomElement('basic-element') | 12 @CustomElement('basic-element') |
| 13 class BasicElement extends HtmlElement { | 13 class BasicElement extends HtmlElement { |
| 14 BasicElement.created() : super.created(); | 14 BasicElement.created() : super.created(); |
| 15 | 15 |
| 16 factory BasicElement() => document.createElement('basic-element'); | 16 factory BasicElement() => document.createElement('basic-element'); |
| 17 } | 17 } |
| 18 | 18 |
| 19 @CustomElement('child-element') | 19 @CustomElement('child-element') |
| 20 class ChildElement extends BasicElement { | 20 class ChildElement extends BasicElement { |
| 21 ChildElement.created() : super.created(); | 21 ChildElement.created() : super.created(); |
| 22 | 22 |
| 23 factory ChildElement() => document.createElement('child-element'); | 23 factory ChildElement() => document.createElement('child-element'); |
| 24 } | 24 } |
| 25 | 25 |
| 26 @CustomElement('extended-element', extendsTag: 'input') | 26 @CustomElement('extended-element', extendsTag: 'input') |
| 27 class ExtendedElement extends InputElement { | 27 class ExtendedElement extends InputElement { |
| 28 ExtendedElement.created() : super.created(); | 28 ExtendedElement.created() : super.created(); |
| 29 | 29 |
| 30 factory ExtendedElement() => | 30 factory ExtendedElement() => |
| 31 document.createElement('input', 'extended-element'); | 31 document.createElement('input', 'extended-element'); |
| 32 } | 32 } |
| 33 | 33 |
| 34 main() { | 34 main() { |
| 35 useHtmlConfiguration(); | 35 return initWebComponents().then((_) { |
| 36 initWebComponents().then((_) { | |
| 37 var container = querySelector('#container') as DivElement; | 36 var container = querySelector('#container') as DivElement; |
| 38 | 37 |
| 39 setUp(() { | 38 setUp(() { |
| 40 return new Future(() {}); | 39 return new Future(() {}); |
| 41 }); | 40 }); |
| 42 | 41 |
| 43 tearDown(() { | 42 tearDown(() { |
| 44 container.children.clear(); | 43 container.children.clear(); |
| 45 }); | 44 }); |
| 46 | 45 |
| 47 test('basic custom element', () { | 46 test('basic custom element', () { |
| 48 expect(document.querySelector('basic-element') is BasicElement, isTrue); | 47 expect(document.querySelector('basic-element') is BasicElement, isTrue); |
| 49 container.append(new BasicElement()); | 48 container.append(new BasicElement()); |
| 50 container.appendHtml('<basic-element></basic-element>'); | 49 container.appendHtml('<basic-element></basic-element>', |
| 51 // TODO(jakemac): after appendHtml elements are upgraded asynchronously, | 50 treeSanitizer: nullSanitizer); |
| 52 // why? https://github.com/dart-lang/web-components/issues/4 | 51 // elements are upgraded asynchronously |
| 53 return new Future(() {}).then((_) { | 52 return new Future(() {}).then((_) { |
| 54 var elements = container.querySelectorAll('basic-element'); | 53 var elements = container.querySelectorAll('basic-element'); |
| 55 expect(elements.length, 2); | 54 expect(elements.length, 2); |
| 56 for (var element in elements) { | 55 for (var element in elements) { |
| 57 expect(element is BasicElement, isTrue); | 56 expect(element is BasicElement, isTrue); |
| 58 } | 57 } |
| 59 }); | 58 }); |
| 60 }); | 59 }); |
| 61 | 60 |
| 62 test('child custom element', () { | 61 test('child custom element', () { |
| 63 expect(document.querySelector('child-element') is ChildElement, isTrue); | 62 expect(document.querySelector('child-element') is ChildElement, isTrue); |
| 64 container.append(new ChildElement()); | 63 container.append(new ChildElement()); |
| 65 container.appendHtml('<child-element></child-element>'); | 64 container.appendHtml('<child-element></child-element>', |
| 66 // TODO(jakemac): after appendHtml elements are upgraded asynchronously, | 65 treeSanitizer: nullSanitizer); |
| 67 // why? https://github.com/dart-lang/web-components/issues/4 | 66 // elements are upgraded asynchronously |
| 68 return new Future(() {}).then((_) { | 67 return new Future(() {}).then((_) { |
| 69 var elements = container.querySelectorAll('child-element'); | 68 var elements = container.querySelectorAll('child-element'); |
| 70 expect(elements.length, 2); | 69 expect(elements.length, 2); |
| 71 for (var element in elements) { | 70 for (var element in elements) { |
| 72 expect(element is ChildElement, isTrue); | 71 expect(element is ChildElement, isTrue); |
| 73 } | 72 } |
| 74 }); | 73 }); |
| 75 }); | 74 }); |
| 76 | 75 |
| 77 test('extends input element', () { | 76 test('extends input element', () { |
| 78 expect(document.querySelector('input') is ExtendedElement, isTrue); | 77 expect(document.querySelector('input') is ExtendedElement, isTrue); |
| 79 container.append(new ExtendedElement()); | 78 container.append(new ExtendedElement()); |
| 80 container.appendHtml('<input is="extended-element" />'); | 79 container.appendHtml('<input is="extended-element" />', |
| 81 // TODO(jakemac): after appendHtml elements are upgraded asynchronously, | 80 treeSanitizer: nullSanitizer); |
| 82 // why? https://github.com/dart-lang/web-components/issues/4 | 81 // elements are upgraded asynchronously |
| 83 return new Future(() {}).then((_) { | 82 return new Future(() {}).then((_) { |
| 84 var elements = container.querySelectorAll('input'); | 83 var elements = container.querySelectorAll('input'); |
| 85 expect(elements.length, 2); | 84 expect(elements.length, 2); |
| 86 for (var element in elements) { | 85 for (var element in elements) { |
| 87 expect(element is ExtendedElement, isTrue); | 86 expect(element is ExtendedElement, isTrue); |
| 88 } | 87 } |
| 89 }); | 88 }); |
| 90 }); | 89 }); |
| 91 }); | 90 }); |
| 92 } | 91 } |
| 92 |
| 93 class NullTreeSanitizer implements NodeTreeSanitizer { |
| 94 const NullTreeSanitizer(); |
| 95 void sanitizeTree(Node node) {} |
| 96 } |
| 97 |
| 98 final nullSanitizer = const NullTreeSanitizer(); |
| OLD | NEW |