salesforce / lwc

⚡️ LWC - A Blazing Fast, Enterprise-Grade Web Components Foundation
https://lwc.dev
Other
1.64k stars 393 forks source link

SSR compiler interprets all classes with superclasses as LWC components #4938

Open lpomerleau opened 9 hours ago

lpomerleau commented 9 hours ago

Description

Any code which has SomeClass extends SuperClass is identified as an LWC component by the SSR compiler.

// stripped down version of LWR's implementation of the NavigationMixin

const Navigate = Symbol('Navigate');
const GenerateUrl = Symbol('GenerateUrl');

function NavigationMixin<TBase extends Constructor>(Base: TBase): TBase {
    invariant(typeof Base.prototype.dispatchEvent === 'function', messages.INVALID_MIXIN_CMP, [Base.toString()]);
    class Mixin extends Base {
        [Navigate](pageRef: PageReference, replace?: boolean, options?: NavigateOptions): void { /* do stuff */  }
        async [GenerateUrl](pageRef: PageReference, options?: NavigateOptions): Promise<string | null> { /* do stuff */ }
    }
    return Mixin;
}

NavigationMixin.Navigate = Navigate;
NavigationMixin.GenerateUrl = GenerateUrl;
export { NavigationMixin };

The class Mixin extends Base causes the SSR compiler to create an invalid generateMarkup, where Mixin is not defined -> the compiled code cannot be loaded/executed.

Expected Results

No error is throw; SSR compiled code can be executed.

Actual Results

ClassName is not defined

Browsers Affected

Node.js

Version

Possible Solution

The babel-plugin-component only considers export default class with an extends to be an "LWC component". The @lwc/ssr-compiler should work the same way.

git2gus[bot] commented 8 hours ago

This issue has been linked to a new work item: W-17312358