msb-public
/
svelte
mirror of https://github.com/sveltejs/svelte
1
0
Code Issues Projects Releases Wiki Activity

prevent erroneous missing data warnings for custom elements - fixes #1065

Browse Source
pull/1154/head
Rich Harris 7 years ago
parent 29a156957f
commit 9dda4b0563
5 changed files with 39 additions and 3 deletions
Show Stats Download Patch File Download Diff File

6
src/generators/dom/index.ts
Unescape View File

@ -219,7 +219,11 @@ export default function dom(
const message = generator.components.has(prop) ? const message = generator.components.has(prop) ?
`${debugName} expected to find '${prop}' in \`data\`, but found it in \`components\` instead` : `${debugName} expected to find '${prop}' in \`data\`, but found it in \`components\` instead` :
`${debugName} was created without expected data property '${prop}'`; `${debugName} was created without expected data property '${prop}'`;
return `if (!('${prop}' in this._state)) console.warn("${message}");`
const conditions = [`!('${prop}' in this._state)`];
if (generator.customElement) conditions.push(`!('${prop}' in this.attributes)`);
return `if (${conditions.join(' && ')}) console.warn("${message}");`
})} })}
${generator.bindingGroups.length && ${generator.bindingGroups.length &&
`this._bindingGroups = [${Array(generator.bindingGroups.length).fill('[]').join(', ')}];`} `this._bindingGroups = [${Array(generator.bindingGroups.length).fill('[]').join(', ')}];`}

7
test/custom-elements/index.js
Unescape View File

@ -3,7 +3,7 @@ import * as http from 'http';
import { rollup } from 'rollup'; import { rollup } from 'rollup';
import virtual from 'rollup-plugin-virtual'; import virtual from 'rollup-plugin-virtual';
import Nightmare from 'nightmare'; import Nightmare from 'nightmare';
import { loadSvelte } from "../helpers.js"; import { loadSvelte, loadConfig } from "../helpers.js";
const page = ` const page = `
<body> <body>
@ -57,6 +57,8 @@ describe('custom-elements', function() {
const solo = /\.solo$/.test(dir); const solo = /\.solo$/.test(dir);
(solo ? it.only : it)(dir, () => { (solo ? it.only : it)(dir, () => {
const config = loadConfig(`./custom-elements/samples/${dir}/_config.js`);
return rollup({ return rollup({
input: `test/custom-elements/samples/${dir}/test.js`, input: `test/custom-elements/samples/${dir}/test.js`,
plugins: [ plugins: [
@ -64,7 +66,8 @@ describe('custom-elements', function() {
transform(code, id) { transform(code, id) {
if (id.endsWith('.html')) { if (id.endsWith('.html')) {
const compiled = svelte.compile(code, { const compiled = svelte.compile(code, {
customElement: true customElement: true,
dev: config.dev
}); });
return { return {

3
test/custom-elements/samples/no-missing-prop-warnings/_config.js
Unescape View File

@ -0,0 +1,3 @@
export default {
dev: true
};

8
test/custom-elements/samples/no-missing-prop-warnings/main.html
Unescape View File

@ -0,0 +1,8 @@
<p>foo: {{foo}}</p>
<p>bar: {{bar}}</p>
<script>
export default {
tag: 'my-app'
};
</script>

18
test/custom-elements/samples/no-missing-prop-warnings/test.js
Unescape View File

@ -0,0 +1,18 @@
import * as assert from 'assert';
import './main.html';
export default function (target) {
const warnings = [];
const warn = console.warn;
console.warn = warning => {
warnings.push(warning);
};
target.innerHTML = '<my-app foo=yes />';
assert.equal(warnings.length, 1);
assert.equal(warnings[0], `<my-app> was created without expected data property 'bar'`);
console.warn = warn;
}
Write Preview
Loading…
Cancel
Save