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
LWC: 18.10.1
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.
Description
Any code which has
SomeClass extends SuperClass
is identified as an LWC component by the SSR compiler.The
class Mixin extends Base
causes the SSR compiler to create an invalidgenerateMarkup
, whereMixin
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 considersexport default class
with anextends
to be an "LWC component". The@lwc/ssr-compiler
should work the same way.