diff --git a/src/parse/index.ts b/src/parse/index.ts index 1bf3e2e589..94c115c864 100644 --- a/src/parse/index.ts +++ b/src/parse/index.ts @@ -11,6 +11,7 @@ import error from '../utils/error'; interface ParserOptions { filename?: string; bind?: boolean; + customElement?: boolean; } type ParserState = (parser: Parser) => (ParserState | void); @@ -18,6 +19,7 @@ type ParserState = (parser: Parser) => (ParserState | void); export class Parser { readonly template: string; readonly filename?: string; + readonly customElement: boolean; index: number; stack: Array; @@ -36,6 +38,7 @@ export class Parser { this.template = template.replace(/\s+$/, ''); this.filename = options.filename; + this.customElement = options.customElement; this.allowBindings = options.bind !== false; diff --git a/src/parse/state/tag.ts b/src/parse/state/tag.ts index 7ffa139d3b..074f790b65 100644 --- a/src/parse/state/tag.ts +++ b/src/parse/state/tag.ts @@ -125,7 +125,7 @@ export default function tag(parser: Parser) { ? metaTags.get(name) : (/[A-Z]/.test(name[0]) || name === 'svelte:self' || name === 'svelte:component') ? 'Component' : name === 'title' && parentIsHead(parser.stack) ? 'Title' - : name === 'slot' ? 'Slot' : 'Element'; + : name === 'slot' && !parser.customElement ? 'Slot' : 'Element'; const element: Node = { start, diff --git a/src/validate/html/validateComponent.ts b/src/validate/html/validateComponent.ts index 9e492e36a2..e5cab392a6 100644 --- a/src/validate/html/validateComponent.ts +++ b/src/validate/html/validateComponent.ts @@ -11,7 +11,7 @@ export default function validateComponent( stack: Node[], elementStack: Node[] ) { - if (!validator.components.has(node.name)) { + if (node.name !== 'svelte:self' && node.name !== 'svelte:component' && !validator.components.has(node.name)) { validator.error(node, { code: `missing-component`, message: `${node.name} component is not defined`