tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

test_custom_element_when_defined.html (4269B)

      1 <!DOCTYPE HTML>
      2 <html>
      3 <!--
      4 https://bugzilla.mozilla.org/show_bug.cgi?id=1275839
      5 -->
      6 <head>
      7  <title>Test custom elements whenDefined function.</title>
      8  <script src="/tests/SimpleTest/SimpleTest.js"></script>
      9  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
     10 </head>
     11 <body>
     12 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1275839">Bug 1275839</a>
     13 <iframe id="iframe"></iframe>
     14 <script>
     15 
     16 SimpleTest.waitForExplicitFinish();
     17 
     18 const testWindow = iframe.contentDocument.defaultView;
     19 const customElements = testWindow.customElements;
     20 const expectSyntaxError = 'SyntaxError';
     21 
     22 function testCustomElementsAvailable() {
     23  ok('customElements' in testWindow, '"window.customElements" exists');
     24  ok('define' in customElements, '"window.customElements.define" exists');
     25  ok('whenDefined' in customElements, '"window.customElements.get" exists');
     26 }
     27 
     28 function testCustomElementsPromiseEqually() {
     29  // 4. If map does not contain an entry with key name, create an entry in
     30  // map with key name and whose value is a new promise.
     31  let promiseElement1 = customElements.whenDefined('x-element1');
     32  let promiseElement2 = customElements.whenDefined('x-element2');
     33 
     34  ok(promiseElement1 instanceof testWindow.Promise &&
     35     promiseElement2 instanceof testWindow.Promise,
     36     "promiseElement1 and promiseElement2 should return promises.");
     37 
     38  // 5. Let promise be the value of the entry in map with key name.
     39  // 6. Return promise
     40  let sameAsPromiseElement1 = customElements.whenDefined('x-element1');
     41 
     42  ok(sameAsPromiseElement1 instanceof testWindow.Promise,
     43     "sameAsPromiseElement1 should return promise.");
     44  is(promiseElement1, sameAsPromiseElement1,
     45     "Same name should return same promise.");
     46  isnot(promiseElement1, promiseElement2,
     47        "whenDefined() returns different promises for different names.");
     48 }
     49 
     50 function testCustomElementsNameDefined() {
     51  let name = 'x-foo';
     52  let beforeDefinedPromise = customElements.whenDefined(name);
     53 
     54  customElements.define(name, class {});
     55 
     56  // 2. If this CustomElementRegistry contains an entry with name name,
     57  // then return a new promise resolved with undefined and abort these
     58  // steps.
     59  return beforeDefinedPromise.then(() => {
     60    let afterDefinedPromise = customElements.whenDefined(name);
     61    isnot(beforeDefinedPromise, afterDefinedPromise,
     62          "When name is defined, we should have a new promise.");
     63 
     64    let newPromise = customElements.whenDefined(name);
     65    isnot(afterDefinedPromise, newPromise,
     66          "Once name is defined, whenDefined() always returns a new promise.");
     67    return Promise.all([newPromise, afterDefinedPromise]);
     68  });
     69 }
     70 
     71 function testCustomElementsNameNotDefined() {
     72  let isResolved = false;
     73  customElements.whenDefined('x-name-not-defined').then(() => {
     74    isResolved = true;
     75  });
     76 
     77  return new Promise((aResolve, aReject) => {
     78    setTimeout(
     79      function() {
     80        ok(!isResolved, "Promise for not defined name should not be resolved.");
     81        aResolve();
     82      }, 0);
     83  });
     84 }
     85 
     86 function testCustomElementsInvalidName() {
     87  let invalidCustomElementNames = [
     88    undefined,
     89    null,
     90    '',
     91    '-',
     92    'a',
     93    'input',
     94    'mycustomelement',
     95    'A',
     96    'A-',
     97    '0-',
     98    'a-A',
     99    'a-Z',
    100    'A-a',
    101    // name must not be any of the hyphen-containing element names.
    102    'annotation-xml',
    103    'color-profile',
    104    'font-face',
    105    'font-face-src',
    106    'font-face-uri',
    107    'font-face-format',
    108    'font-face-name',
    109    'missing-glyph',
    110  ];
    111 
    112  let promises = [];
    113  invalidCustomElementNames.forEach(name => {
    114    const expectSyntaxErrorPromise = customElements.whenDefined(name);
    115 
    116    promises.push(expectSyntaxErrorPromise.then(() => {
    117      ok(false, "CustomElements with invalid name should throw SyntaxError.");
    118    }, (ex) => {
    119      is(ex.name, expectSyntaxError,
    120         "CustomElements with invalid name should throw SyntaxError.");
    121    }));
    122  });
    123 
    124  return Promise.all(promises);
    125 }
    126 
    127 Promise.resolve()
    128 .then(() => testCustomElementsAvailable())
    129 .then(() => testCustomElementsPromiseEqually())
    130 .then(() => testCustomElementsNameDefined())
    131 .then(() => testCustomElementsNameNotDefined())
    132 .then(() => testCustomElementsInvalidName())
    133 .then(() => SimpleTest.finish());
    134 
    135 </script>
    136 </body>
    137 </html>