Chromium Code Reviews Chromium Code Reviews
Issue 1989343002:
Implement :defined pseudo-class selector for Custom Elements (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@ce-state| Index: third_party/WebKit/LayoutTests/custom-elements/spec/selectors/pseudo-class-defined.html |
| diff --git a/third_party/WebKit/LayoutTests/custom-elements/spec/selectors/pseudo-class-defined.html b/third_party/WebKit/LayoutTests/custom-elements/spec/selectors/pseudo-class-defined.html |
| new file mode 100644 |
| index 0000000000000000000000000000000000000000..5a3a1ea1560fea451d062c28801e2cfd39699582 |
| --- /dev/null |
| +++ b/third_party/WebKit/LayoutTests/custom-elements/spec/selectors/pseudo-class-defined.html |
| @@ -0,0 +1,53 @@ |
| +<!DOCTYPE html> |
| +<script src="../../../resources/testharness.js"></script> |
| +<script src="../../../resources/testharnessreport.js"></script> |
| +<div id="log"></div> |
|
rune
2016/05/25 23:43:07
Is the #log element necessary?
kojii
2016/05/26 01:25:40
Good point. Until recently, our testharnessreport.
|
| +<iframe id="iframe"></iframe> |
| +<script> |
| +const testList = [ |
| + { name: 'div', defined: true }, |
| + { name: 'a-a', defined: false }, |
| + { name: 'font-face', defined: true }, |
| +]; |
| + |
| +// Setup iframe to test the parser. |
| +const neither = 'rgb(255, 0, 0)'; |
| +const defined = 'rgb(255, 165, 0)'; |
| +const not_defined = 'rgb(0, 0, 255)'; |
| +iframe.srcdoc = '<style>' |
| + + `* { color:${neither}; }` |
|
rune
2016/05/25 23:43:07
Looks like you're mixing single-quotes and back-ti
kojii
2016/05/26 01:25:40
Only back-ticks does template literals which I rec
kojii
2016/05/26 04:49:43
I happen to find the back-ticks support new-lines
rune
2016/05/26 07:16:27
No looks good now. Excuse my ES6 ignorance. I didn
|
| + + `:defined { color:${defined}; }` |
| + + `:not(:defined) { color:${not_defined}; }` |
| + + '</style>' |
| + + testList.map(d => `<${d.name}></${d.name}>`).join(''); |
| +setup({ explicit_done: true }); |
| +iframe.onload = () => { |
| + const doc = iframe.contentDocument; |
| + |
| + for (const data of testList) { |
| + test_defined(data.defined, doc.getElementsByTagName(data.name)[0], `<${data.name}>`); |
| + |
| + let element = doc.createElement(data.name); |
| + doc.body.appendChild(element); |
| + test_defined(data.defined, element, `createElement("${data.name}")`); |
| + |
| + element = doc.createElementNS('http://www.w3.org/1999/xhtml', data.name); |
| + doc.body.appendChild(element); |
| + test_defined(data.defined, element, `createElementNS("http://www.w3.org/1999/xhtml", "${data.name}")`); |
| + |
| + element = doc.createElementNS('http://www.w3.org/2000/svg', data.name); |
| + doc.body.appendChild(element); |
| + test_defined(true, element, `createElementNS("http://www.w3.org/2000/svg", "${data.name}")`); |
| + } |
| + |
| + function test_defined(expected, element, description) { |
| + test(() => { |
| + assert_equals(element.matches(':defined'), expected, 'matches(":defined")'); |
| + assert_equals(element.matches(':not(:defined)'), !expected, 'matches(":not(:defined")'); |
| + assert_equals(doc.defaultView.getComputedStyle(element).color, expected ? defined : not_defined, 'getComputedStyle'); |
| + }, `${description} should ${expected ? 'be' : 'not be'} :defined`); |
| + } |
| + |
| + done(); |
| +}; |
| +</script> |
