diff --git a/example/src/modules/x/wireAdapters/wireAdapters.ts b/example/src/modules/x/wireAdapters/wireAdapters.ts new file mode 100644 index 0000000..a41f3bd --- /dev/null +++ b/example/src/modules/x/wireAdapters/wireAdapters.ts @@ -0,0 +1,70 @@ +import type { WireAdapter, WireDataCallback, StringKeyedRecord } from 'lwc'; + +class BaseWireAdapter< + Value, + Config extends StringKeyedRecord = StringKeyedRecord, + Context extends StringKeyedRecord = { tagName: string }, +> implements WireAdapter +{ + protected connected = false; + protected config?: Config; + + constructor( + protected dataCallback: WireDataCallback, + protected sourceContext?: Context, + ) {} + + connect() { + this.connected = true; + } + + disconnect() { + this.connected = false; + } + + update(config: Config) { + this.config = config; + this.emit(); + } + + emit() { + throw new Error('Not implemented'); + } +} + +export class getCurrentTime extends BaseWireAdapter { + interval?: ReturnType; + + emit() { + clearInterval(this.interval); + + this.dataCallback(new Date()); + + if (!this.config) { + return; + } + + if (this.config.refresh) { + this.interval = setInterval(() => this.dataCallback(new Date()), this.config.interval); + } + } +} + +export class getSourceContext extends BaseWireAdapter<{ tagName: string }> { + emit() { + if (this.sourceContext) { + this.dataCallback(this.sourceContext); + } + } +} + +export class getResponse extends BaseWireAdapter { + async emit() { + if (!this.config) { + return; + } + const response = await fetch(this.config.url); + const text = await response.text(); + this.dataCallback(text); + } +} diff --git a/example/src/modules/x/wireView/wireView.html b/example/src/modules/x/wireView/wireView.html new file mode 100644 index 0000000..dcfe582 --- /dev/null +++ b/example/src/modules/x/wireView/wireView.html @@ -0,0 +1,22 @@ + \ No newline at end of file diff --git a/example/src/modules/x/wireView/wireView.js b/example/src/modules/x/wireView/wireView.js new file mode 100644 index 0000000..b3187b4 --- /dev/null +++ b/example/src/modules/x/wireView/wireView.js @@ -0,0 +1,27 @@ +import { LightningElement, api, wire } from 'lwc'; +import { getCurrentTime, getSourceContext, getResponse } from 'x/wireAdapters'; + +export default class WireView extends LightningElement { + @api refresh = false; + @api interval = 1000; + @api url = '/virtual/empty.html'; + + @wire(getCurrentTime, { refresh: '$refresh', interval: '$interval' }) + currentTime; + @wire(getSourceContext) + sourceContext; + @wire(getResponse, { url: '$url' }) + response; + + handleRefreshChange(event) { + this.refresh = event.target.checked; + } + + handleIntervalChange(event) { + this.interval = event.target.value; + } + + handleUrlChange(event) { + this.url = event.target.value; + } +} diff --git a/example/src/modules/x/wireView/wireView.spec.js b/example/src/modules/x/wireView/wireView.spec.js new file mode 100644 index 0000000..0ee93ee --- /dev/null +++ b/example/src/modules/x/wireView/wireView.spec.js @@ -0,0 +1,32 @@ +import { + expect, + hydrateElement, + insertMarkupIntoDom, + querySelectorDeep, + renderToMarkup, +} from '@lwc/test-runner'; + +const componentPath = import.meta.resolve('./wireView.js'); + +describe('', () => { + it('renders to SSR & hydrates successfully', async () => { + const markup = await renderToMarkup(componentPath, {}); + // Make assertions about raw HTML markup. + expect(markup).to.contain(''); + + const el = await insertMarkupIntoDom(markup); + // Make assertions about pre-hydrated DOM. + const hydratedWithSsrDOM = await hydrateElement(el, componentPath); + // Ensure hydration occurred without validation errors. + expect(hydratedWithSsrDOM).to.be.true; + // Make assertions about post-hydrated DOM. + expect(querySelectorDeep('#currentTime')).to.have.text(''); + + await Promise.resolve(); + + // Make assertions about post-update DOM. + expect(querySelectorDeep('#currentTime')).to.have.text(new Date().toString()); + + expect(querySelectorDeep('#tagName')).to.have.text('x-wire-view'); + }); +}); diff --git a/packages/@lwc/wds-core/src/node/plugins/lwc/resolve-engine.js b/packages/@lwc/wds-core/src/node/plugins/lwc/resolve-engine.js index da4b0b2..30664e2 100644 --- a/packages/@lwc/wds-core/src/node/plugins/lwc/resolve-engine.js +++ b/packages/@lwc/wds-core/src/node/plugins/lwc/resolve-engine.js @@ -55,7 +55,7 @@ const { function patchedRegisterDecorators(Ctor, meta) { // This is currently a no-op. In the future, we may need to intercept // the registration of decorators, which is why the function exists. - return registerDecorators(Ctor, meta); + return registerDecorators(Ctor, meta); } export {