v0.16.0

Overview

This release refactors some WCC's DOM shim internals as well as address issues with setting element properties and honoring the mode option for attachShadow. There was also a breaking change to remove the deprecated getInnerHTML call with getHTML on the Node class in the DOM shim.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.16.0

1. Replace deprecated method getInnerHTML with getHTML (thank you @DannyMoerkerke 🙌 )
2. refactor DOM shim internals (thank you very much @briangrider 🙌 )
3. Issue Setting Element Properties (thank you @briangrider 🙌 )
4. support configurable shadowrootmode attribute for <template> tags (thank you @briangrider 🙌 )
5. verify / ensure proper serialization of shadow roots excluding closed shadow roots from getInnerHTML getHTML (thank you @briangrider 🙌 )
6. Upgrade parse5 to v7

Breaking Changes

DOM Shim

On the Node class, the getInnerHTML method has been deprecated and replaced with getHTML to align with the spec

// before
import 'wc-compiler/src/dom-shim.js';
import Greeting from './components/greeting.js';

const greeting = new Greeting();
const html = greeting.getInnerHTML({ includeShadowRoots: true });

// after
import 'wc-compiler/src/dom-shim.js';
import Greeting from './components/greeting.js';

const greeting = new Greeting();
const html = greeting.getHTML({ serializableShadowRoots: true });

Shadow Root Templates

Setting innerHTML on a Shadow Root will now automatically insert a <template> tag when using renderToString / renderFromHTML, e.g.

class MyComponent extends HTMLElement {

  connectedCallback() {
    if (!this.shadowRoot) {
      this.attachShadow({ mode: 'open' });
      this.shadowRoot.innerHTML = `
        <style>
          :root {
            --accent: #367588;
          }
        </style>

        <main>
          <h1>My Website</h1>
        </main>
      `;
    }
  }
}

export default Home;

Known Issues

N / A

Diff

0.15.1...0.16.0

v0.15.1

Overview

This release fixes issues with standard JavaScript failing parsing and removes needs for a specific dependency for parsing Import Attributes.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.15.1

1. failing on Class fields usage
2. Import Attributes support in Acorn

Breaking Changes

N / A

Known Issues

N / A

Diff

0.15.0...0.15.1

v0.15.0

Overview

This release introduces formal support for HTML (Light DOM) Web Components and fixing a bug for "top level" attributes not serializing and showing up as undefined.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.15.0

1. HTML (Light DOM) Web Components
2. top level attributes returning as undefined

Breaking Changes

N / A

Known Issues

N / A

Diff

0.14.0...0.15.0

v0.14.0

Overview

This release introduces parsing support for TypeScript authored custom elements.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.14.0

1. TypeScript parsing support

Breaking Changes

N / A

Known Issues

N / A

Diff

0.13.0...0.14.0

v0.13.0

Overview

This release introduces support for parsing Import Attributes syntax and and a basic no-op DOM shim for CSSStyleSheet (Constructable Stylesheets).

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.13.0

1. Import Attributes syntax parsing
2. Support Constructable Stylesheets (CSS Modules) in DOM Shim
3. WCC dropping query params when loading module URLs

Breaking Changes

N / A

Known Issues

N / A

Diff

$ git diff 0.12.1 0.13.0 --stat
 .eslintrc.cjs                                                       |   10 +
 .nvmrc                                                              |    2 +-
 docs/pages/docs.md                                                  |    6 +-
 docs/pages/index.md                                                 |    1 +
 package-lock.json                                                   | 1398 +++++++++++++++++++++++++++++++++++++++++++++++++++++-
 package.json                                                        |   13 +-
 src/dom-shim.js                                                     |   12 +-
 src/jsx-loader.js                                                   |    6 +-
 src/wcc.js                                                          |   17 +-
 test/cases/constructable-stylesheet/constructabe-stylesheet.spec.js |   38 ++
 test/cases/constructable-stylesheet/src/components/header/header.js |   23 +
 test/cases/constructable-stylesheet/src/pages/index.js              |   10 +
 test/cases/import-attributes/import-attributes.spec.js              |   48 ++
 test/cases/import-attributes/src/components/header/data.json        |    3 +
 test/cases/import-attributes/src/components/header/header.js        |   17 +
 test/cases/import-attributes/src/pages/index.js                     |   10 +
 16 files changed, 1576 insertions(+), 38 deletions(-)

v0.12.1

Overview

This release fixes missing package reference coming out of the changes to adopt an ESM friendly version of acorn-jsx.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.12.1

1. error for missing acorn-jsx package

Breaking Changes

N / A

Known Issues

N / A

Diff

$ git diff 0.12.0 0.12.1 --stat
 package.json      | 2 +-
 src/jsx-loader.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

v0.12.0

Overview

This release fixes and stabilizes the DOM shim loading to be more resilient in SSR environments, in addition to forking some of our dependencies to an ESM and more bundler friendly version.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.12.0

1. duplicate loads of the DOM shim leads to an infinite rendering issue
2. registration of a custom element is being assumed when initializing a custom element
3. vendor a bundle friendly and ESM compatible version of acorn-jsx
4. adopt a bundle friendly and ESM compatible fork of escodegen

Breaking Changes

You won't require a JSON plugin (e.g. for Rollup) now that our fork of escodegen does not have a require call in it to read package.json for getting the version

Known Issues

1. error for missing acorn-jsx package

Diff

$ git diff 0.11.0 0.12.0 --stat
 .npmrc            |   1 +
 package-lock.json | 739 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++------------------------------
 package.json      |  13 +-
 rollup.config.js  |   6 +-
 src/dom-shim.js   |  20 ++-
 src/jsx-loader.js |   6 +-
 src/wcc.js        |   8 +-
 7 files changed, 560 insertions(+), 233 deletions(-)

v0.11.0

Overview

This release fixes a bug in the DOM shim and some enhancements / fixes around JSX compilation.

For posterity there was also a good question issue raised around handling the browser warning - ["declarative Shadow DOM has not been enabled by includeShadowRoots"](declarative Shadow DOM has not been enabled by includeShadowRoots), for those curious.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.11.0

1. HTMLTemplateElement should not have a set innerHTML method
2. leverage getRootNode() for referencing Shadow DOM based parent node reference in JSX output
3. JSX components not rendering into a declarative shadow root (e.g. <template> tag)

Breaking Changes

None

Known Issues

N / A

Diff

$ git diff 0.10.0 0.11.0 --stat
 .github/workflows/ci-exp-win.yml                                                          |   2 +-
 .github/workflows/ci-exp.yml                                                              |   2 +-
 .github/workflows/ci-win.yml                                                              |   2 +-
 .github/workflows/ci.yml                                                                  |   2 +-
 .github/workflows/master.yml                                                              |  28 ------
 .gitignore                                                                                |   3 +-
 .github/CONTRIBUTING.md => CONTRIBUTING.md                                                |  13 +--
 docs/pages/docs.md                                                                        |  32 +++++-
 netlify.toml                                                                              |   2 +-
 package-lock.json                                                                         | 228 +++++++++++++++++--------------------------
 package.json                                                                              |  15 +--
 sandbox.js                                                                                |  58 +++++++++++
 sandbox/components/card.js                                                                |  43 ++++++++
 sandbox/components/card.jsx                                                               |  54 ++++++++++
 sandbox/components/counter-dsd.jsx                                                        |  30 ++++++
 sandbox/components/counter.jsx                                                            |  27 +++++
 sandbox/components/header.js                                                              |  11 +++
 sandbox/components/header.jsx                                                             |  16 +++
 sandbox/index.html                                                                        | 142 +++++++++++++++++++++++++++
 src/dom-shim.js                                                                           |  24 ++---
 src/jsx-loader.js                                                                         |  37 ++++---
 .../fixtures/attribute-changed-callback.txt                                               |   0
 .../fixtures/get-observed-attributes.txt                                                  |   0
 .../jsx-inferred-obsevability.spec.js}                                                    |   2 +-
 test/cases/{jsx-coarse-grained => jsx-inferred-observability}/src/counter.jsx             |   0
 test/cases/jsx-shadow-dom/jsx-shadow-dom.spec.js                                          |  71 ++++++++++++++
 test/cases/jsx-shadow-dom/src/heading.jsx                                                 |  27 +++++
 test/cases/node-modules/src/components/events-list.js

v0.10.0

Overview

This release migrates WCC to use the spec compliant shadowrootmode attribute. (instead of shadowroot)

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.10.0

1. support shadowrootmode attribute for declarative shadow DOM

Breaking Changes

None

Known Issues

N / A

Diff

$ git diff 0.9.1 0.10.0 --stat
 README.md                                                |  2 +-
 docs/pages/docs.md                                       |  2 +-
 docs/pages/index.md                                      |  2 +-
 package.json                                             |  3 ++-
 src/dom-shim.js                                          |  2 +-
 test/cases/attributes/attributes.spec.js                 |  4 ++--
 test/cases/attributes/src/components/counter.js          |  2 +-
 test/cases/children-and-slots/children-and-slots.spec.js |  6 +++---
 test/cases/custom-extension/custom-extension.spec.js     |  4 ++--
 test/cases/get-data/get-data.spec.js                     |  4 ++--
 test/cases/get-data/src/components/counter.js            |  2 +-
 test/cases/nested-elements/nested-elements.spec.js       | 10 +++++-----
 test/cases/nested-elements/src/components/header.js      |  2 +-
 test/cases/render-from-html/render-from-html.spec.js     |  4 ++--
 test/cases/single-element/single-element.spec.js         |  4 ++--
 15 files changed, 27 insertions(+), 26 deletions(-)

v0.9.1

Overview

This release improves some of the log messaging related to WCC heuristics for detecting custom element definitions.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.9.1

1. gracefully and accurately handle "empty" entry points and dependency files that don't export a custom element

Breaking Changes

None

Known Issues

N / A

Diff

$ git diff 0.9.0 0.9.1 --stat
 package.json                           |  2 +-
 src/wcc.js                             | 34 +++++++++++++++++++---------------
 test/cases/no-export/no-export.spec.js | 10 ++++++++--
 3 files changed, 28 insertions(+), 18 deletions(-)