tor-browser

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

exportparts-different-scope.html (946B)


      1 <!doctype html>
      2 <meta charset="utf-8">
      3 <link rel="author" href="mailto:emilio@crisal.io" title="Emilio Cobos Álvarez">
      4 <link rel="author" href="https://mozilla.org" title="Mozilla">
      5 <link rel="help" href="https://drafts.csswg.org/css-shadow-parts/">
      6 <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1854658">
      7 <link rel="match" href="exportparts-different-scope-ref.html">
      8 <style>
      9 my-foo::part(text) { color: green; }
     10 my-bar::part(text) { color: red; background-color: red; }
     11 </style>
     12 <my-foo></my-foo>
     13 <script>
     14 customElements.define('my-foo', class extends HTMLElement {
     15  constructor(){
     16    super()
     17    this.attachShadow({mode: 'closed'}).innerHTML = `
     18      <my-bar exportparts="text"></my-bar>
     19    `;
     20  }
     21 })
     22 
     23 customElements.define('my-bar', class extends HTMLElement {
     24  constructor(){
     25    super()
     26    this.attachShadow({mode: 'closed'}).innerHTML = `
     27      <span part="text">Should be green</span>
     28    `;
     29  }
     30 })
     31 </script>