Skip to content

Commit 158ec43

Browse files
authored
[fix] do not warn about missing props for bindings (#6583)
1 parent ce569f9 commit 158ec43

File tree

9 files changed

+89
-67
lines changed

9 files changed

+89
-67
lines changed

src/compiler/compile/render_dom/index.ts

Lines changed: 9 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -121,7 +121,7 @@ export default function dom(
121121
const accessors = [];
122122

123123
const not_equal = component.component_options.immutable ? x`@not_equal` : x`@safe_not_equal`;
124-
let dev_props_check: Node[] | Node;
124+
let missing_props_check: Node[] | Node;
125125
let inject_state: Expression;
126126
let capture_state: Expression;
127127
let props_inject: Node[] | Node;
@@ -227,13 +227,13 @@ export default function dom(
227227
const expected = props.filter(prop => prop.writable && !prop.initialised);
228228

229229
if (expected.length) {
230-
dev_props_check = b`
231-
const { ctx: #ctx } = this.$$;
232-
const props = ${options.customElement ? x`this.attributes` : x`options.props || {}`};
233-
${expected.map(prop => b`
234-
if (${renderer.reference(prop.name)} === undefined && !('${prop.export_name}' in props)) {
235-
@_console.warn("<${component.tag}> was created without expected prop '${prop.export_name}'");
236-
}`)}
230+
missing_props_check = b`
231+
$$self.$$.on_mount.push(function () {
232+
${expected.map(prop => b`
233+
if (${prop.name} === undefined && !(('${prop.export_name}' in $$props) || $$self.$$.bound[$$self.$$.props['${prop.export_name}']])) {
234+
@_console.warn("<${component.tag}> was created without expected prop '${prop.export_name}'");
235+
}`)}
236+
});
237237
`;
238238
}
239239

@@ -476,6 +476,7 @@ export default function dom(
476476
477477
${instance_javascript}
478478
479+
${missing_props_check}
479480
${unknown_props_check}
480481
481482
${renderer.binding_groups.size > 0 && b`const $$binding_groups = [${[...renderer.binding_groups.keys()].map(_ => x`[]`)}];`}
@@ -533,8 +534,6 @@ export default function dom(
533534
534535
@init(this, { target: this.shadowRoot, props: ${init_props}, customElement: true }, ${definition}, ${has_create_fragment ? 'create_fragment' : 'null'}, ${not_equal}, ${prop_indexes}, null, ${dirty});
535536
536-
${dev_props_check}
537-
538537
if (options) {
539538
if (options.target) {
540539
@insert(options.target, this, options.anchor);
@@ -594,8 +593,6 @@ export default function dom(
594593
super(${options.dev && 'options'});
595594
@init(this, options, ${definition}, ${has_create_fragment ? 'create_fragment' : 'null'}, ${not_equal}, ${prop_indexes}, ${optional_parameters});
596595
${options.dev && b`@dispatch_dev("SvelteRegisterComponent", { component: this, tagName: "${name.name}", options, id: create_fragment.name });`}
597-
598-
${dev_props_check}
599596
}
600597
}
601598
`[0] as ClassDeclaration;

test/js/samples/capture-inject-state/expected.js

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -113,6 +113,17 @@ function instance($$self, $$props, $$invalidate) {
113113
let { alias: realName } = $$props;
114114
let local;
115115
let shadowedByModule;
116+
117+
$$self.$$.on_mount.push(function () {
118+
if (prop === undefined && !('prop' in $$props || $$self.$$.bound[$$self.$$.props['prop']])) {
119+
console.warn("<Component> was created without expected prop 'prop'");
120+
}
121+
122+
if (realName === undefined && !('alias' in $$props || $$self.$$.bound[$$self.$$.props['alias']])) {
123+
console.warn("<Component> was created without expected prop 'alias'");
124+
}
125+
});
126+
116127
const writable_props = ['prop', 'alias'];
117128

118129
Object.keys($$props).forEach(key => {
@@ -166,17 +177,6 @@ class Component extends SvelteComponentDev {
166177
options,
167178
id: create_fragment.name
168179
});
169-
170-
const { ctx } = this.$$;
171-
const props = options.props || {};
172-
173-
if (/*prop*/ ctx[0] === undefined && !('prop' in props)) {
174-
console.warn("<Component> was created without expected prop 'prop'");
175-
}
176-
177-
if (/*realName*/ ctx[1] === undefined && !('alias' in props)) {
178-
console.warn("<Component> was created without expected prop 'alias'");
179-
}
180180
}
181181

182182
get prop() {

test/js/samples/debug-empty/expected.js

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,13 @@ function instance($$self, $$props, $$invalidate) {
7272
let { $$slots: slots = {}, $$scope } = $$props;
7373
validate_slots('Component', slots, []);
7474
let { name } = $$props;
75+
76+
$$self.$$.on_mount.push(function () {
77+
if (name === undefined && !('name' in $$props || $$self.$$.bound[$$self.$$.props['name']])) {
78+
console.warn("<Component> was created without expected prop 'name'");
79+
}
80+
});
81+
7582
const writable_props = ['name'];
7683

7784
Object.keys($$props).forEach(key => {
@@ -106,13 +113,6 @@ class Component extends SvelteComponentDev {
106113
options,
107114
id: create_fragment.name
108115
});
109-
110-
const { ctx } = this.$$;
111-
const props = options.props || {};
112-
113-
if (/*name*/ ctx[0] === undefined && !('name' in props)) {
114-
console.warn("<Component> was created without expected prop 'name'");
115-
}
116116
}
117117

118118
get name() {

test/js/samples/debug-foo-bar-baz-things/expected.js

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -176,6 +176,25 @@ function instance($$self, $$props, $$invalidate) {
176176
let { foo } = $$props;
177177
let { bar } = $$props;
178178
let { baz } = $$props;
179+
180+
$$self.$$.on_mount.push(function () {
181+
if (things === undefined && !('things' in $$props || $$self.$$.bound[$$self.$$.props['things']])) {
182+
console.warn("<Component> was created without expected prop 'things'");
183+
}
184+
185+
if (foo === undefined && !('foo' in $$props || $$self.$$.bound[$$self.$$.props['foo']])) {
186+
console.warn("<Component> was created without expected prop 'foo'");
187+
}
188+
189+
if (bar === undefined && !('bar' in $$props || $$self.$$.bound[$$self.$$.props['bar']])) {
190+
console.warn("<Component> was created without expected prop 'bar'");
191+
}
192+
193+
if (baz === undefined && !('baz' in $$props || $$self.$$.bound[$$self.$$.props['baz']])) {
194+
console.warn("<Component> was created without expected prop 'baz'");
195+
}
196+
});
197+
179198
const writable_props = ['things', 'foo', 'bar', 'baz'];
180199

181200
Object.keys($$props).forEach(key => {
@@ -216,25 +235,6 @@ class Component extends SvelteComponentDev {
216235
options,
217236
id: create_fragment.name
218237
});
219-
220-
const { ctx } = this.$$;
221-
const props = options.props || {};
222-
223-
if (/*things*/ ctx[0] === undefined && !('things' in props)) {
224-
console.warn("<Component> was created without expected prop 'things'");
225-
}
226-
227-
if (/*foo*/ ctx[1] === undefined && !('foo' in props)) {
228-
console.warn("<Component> was created without expected prop 'foo'");
229-
}
230-
231-
if (/*bar*/ ctx[2] === undefined && !('bar' in props)) {
232-
console.warn("<Component> was created without expected prop 'bar'");
233-
}
234-
235-
if (/*baz*/ ctx[3] === undefined && !('baz' in props)) {
236-
console.warn("<Component> was created without expected prop 'baz'");
237-
}
238238
}
239239

240240
get things() {

test/js/samples/debug-foo/expected.js

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -168,6 +168,17 @@ function instance($$self, $$props, $$invalidate) {
168168
validate_slots('Component', slots, []);
169169
let { things } = $$props;
170170
let { foo } = $$props;
171+
172+
$$self.$$.on_mount.push(function () {
173+
if (things === undefined && !('things' in $$props || $$self.$$.bound[$$self.$$.props['things']])) {
174+
console.warn("<Component> was created without expected prop 'things'");
175+
}
176+
177+
if (foo === undefined && !('foo' in $$props || $$self.$$.bound[$$self.$$.props['foo']])) {
178+
console.warn("<Component> was created without expected prop 'foo'");
179+
}
180+
});
181+
171182
const writable_props = ['things', 'foo'];
172183

173184
Object.keys($$props).forEach(key => {
@@ -204,17 +215,6 @@ class Component extends SvelteComponentDev {
204215
options,
205216
id: create_fragment.name
206217
});
207-
208-
const { ctx } = this.$$;
209-
const props = options.props || {};
210-
211-
if (/*things*/ ctx[0] === undefined && !('things' in props)) {
212-
console.warn("<Component> was created without expected prop 'things'");
213-
}
214-
215-
if (/*foo*/ ctx[1] === undefined && !('foo' in props)) {
216-
console.warn("<Component> was created without expected prop 'foo'");
217-
}
218218
}
219219

220220
get things() {

test/js/samples/dev-warning-missing-data-computed/expected.js

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,13 @@ function instance($$self, $$props, $$invalidate) {
6969
validate_slots('Component', slots, []);
7070
let { foo } = $$props;
7171
let bar;
72+
73+
$$self.$$.on_mount.push(function () {
74+
if (foo === undefined && !('foo' in $$props || $$self.$$.bound[$$self.$$.props['foo']])) {
75+
console.warn("<Component> was created without expected prop 'foo'");
76+
}
77+
});
78+
7279
const writable_props = ['foo'];
7380

7481
Object.keys($$props).forEach(key => {
@@ -110,13 +117,6 @@ class Component extends SvelteComponentDev {
110117
options,
111118
id: create_fragment.name
112119
});
113-
114-
const { ctx } = this.$$;
115-
const props = options.props || {};
116-
117-
if (/*foo*/ ctx[0] === undefined && !('foo' in props)) {
118-
console.warn("<Component> was created without expected prop 'foo'");
119-
}
120120
}
121121

122122
get foo() {
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<script>
2+
export let w;
3+
export let x;
4+
export let y;
5+
export let z = undefined;
6+
</script>
7+
8+
<div>{w} {x} {y}</div>
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export default {
2+
compileOptions: {
3+
dev: true
4+
},
5+
6+
warnings: [
7+
"<Foo> was created without expected prop 'y'"
8+
]
9+
};
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<script>
2+
import Foo from './Foo.svelte';
3+
4+
let x = undefined;
5+
let w = 'w';
6+
</script>
7+
8+
<Foo bind:w bind:x />

0 commit comments

Comments
 (0)