diff --git a/src/compile/render-dom/index.ts b/src/compile/render-dom/index.ts
index 6678b21872..ade9ed6096 100644
--- a/src/compile/render-dom/index.ts
+++ b/src/compile/render-dom/index.ts
@@ -96,33 +96,39 @@ export default function dom(
props.forEach(x => {
const variable = component.var_lookup.get(x.name);
- if (variable.hoistable) {
+ if (!variable.writable || component.component_options.accessors) {
body.push(deindent`
get ${x.export_name}() {
- return ${x.name};
+ return ${x.hoistable ? x.name : 'this.$$.ctx.' + x.name};
}
`);
- } else if (component.component_options.accessors) {
+ } else if (component.compile_options.dev) {
body.push(deindent`
get ${x.export_name}() {
- return this.$$.ctx.${x.name};
+ throw new Error("<${component.tag}>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''");
}
`);
}
- if (variable.writable && !renderer.readonly.has(x.export_name)) {
- if (component.component_options.accessors) {
+ if (component.component_options.accessors) {
+ if (variable.writable && !renderer.readonly.has(x.name)) {
body.push(deindent`
set ${x.export_name}(${x.name}) {
this.$set({ ${x.name === x.export_name ? x.name : `${x.export_name}: ${x.name}`} });
@flush();
}
`);
+ } else if (component.compile_options.dev) {
+ body.push(deindent`
+ set ${x.export_name}(value) {
+ throw new Error("<${component.tag}>: Cannot set read-only property '${x.export_name}'");
+ }
+ `);
}
} else if (component.compile_options.dev) {
body.push(deindent`
set ${x.export_name}(value) {
- throw new Error("<${component.tag}>: Cannot set read-only property '${x.export_name}'");
+ throw new Error("<${component.tag}>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''");
}
`);
}
diff --git a/test/js/samples/computed-collapsed-if/expected.js b/test/js/samples/computed-collapsed-if/expected.js
index 754d202429..bc01e0dfc0 100644
--- a/test/js/samples/computed-collapsed-if/expected.js
+++ b/test/js/samples/computed-collapsed-if/expected.js
@@ -40,6 +40,14 @@ class SvelteComponent extends SvelteComponent_1 {
super();
init(this, options, instance, create_fragment, safe_not_equal, ["x", "a", "b"]);
}
+
+ get a() {
+ return this.$$.ctx.a;
+ }
+
+ get b() {
+ return this.$$.ctx.b;
+ }
}
export default SvelteComponent;
\ No newline at end of file
diff --git a/test/js/samples/debug-empty/expected.js b/test/js/samples/debug-empty/expected.js
index f122a7b979..73eebd73ca 100644
--- a/test/js/samples/debug-empty/expected.js
+++ b/test/js/samples/debug-empty/expected.js
@@ -82,6 +82,14 @@ class SvelteComponent extends SvelteComponentDev {
console.warn(" was created without expected prop 'name'");
}
}
+
+ get name() {
+ throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''");
+ }
+
+ set name(value) {
+ throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''");
+ }
}
export default SvelteComponent;
\ No newline at end of file
diff --git a/test/js/samples/debug-foo-bar-baz-things/expected.js b/test/js/samples/debug-foo-bar-baz-things/expected.js
index b8b134606c..2ba87abfd9 100644
--- a/test/js/samples/debug-foo-bar-baz-things/expected.js
+++ b/test/js/samples/debug-foo-bar-baz-things/expected.js
@@ -180,6 +180,38 @@ class SvelteComponent extends SvelteComponentDev {
console.warn(" was created without expected prop 'baz'");
}
}
+
+ get things() {
+ throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''");
+ }
+
+ set things(value) {
+ throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''");
+ }
+
+ get foo() {
+ throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''");
+ }
+
+ set foo(value) {
+ throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''");
+ }
+
+ get bar() {
+ throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''");
+ }
+
+ set bar(value) {
+ throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''");
+ }
+
+ get baz() {
+ throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''");
+ }
+
+ set baz(value) {
+ throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''");
+ }
}
export default SvelteComponent;
\ No newline at end of file
diff --git a/test/js/samples/debug-foo/expected.js b/test/js/samples/debug-foo/expected.js
index 94f580ed9d..09502f6025 100644
--- a/test/js/samples/debug-foo/expected.js
+++ b/test/js/samples/debug-foo/expected.js
@@ -172,6 +172,22 @@ class SvelteComponent extends SvelteComponentDev {
console.warn(" was created without expected prop 'foo'");
}
}
+
+ get things() {
+ throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''");
+ }
+
+ set things(value) {
+ throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''");
+ }
+
+ get foo() {
+ throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''");
+ }
+
+ set foo(value) {
+ throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''");
+ }
}
export default SvelteComponent;
\ No newline at end of file
diff --git a/test/js/samples/dev-warning-missing-data-computed/expected.js b/test/js/samples/dev-warning-missing-data-computed/expected.js
index 447477bea5..18ec0e5074 100644
--- a/test/js/samples/dev-warning-missing-data-computed/expected.js
+++ b/test/js/samples/dev-warning-missing-data-computed/expected.js
@@ -88,6 +88,14 @@ class SvelteComponent extends SvelteComponentDev {
console.warn(" was created without expected prop 'foo'");
}
}
+
+ get foo() {
+ throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''");
+ }
+
+ set foo(value) {
+ throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''");
+ }
}
export default SvelteComponent;
\ No newline at end of file
diff --git a/test/runtime/samples/prop-accessors/_config.js b/test/runtime/samples/prop-accessors/_config.js
new file mode 100644
index 0000000000..2f0f0eb442
--- /dev/null
+++ b/test/runtime/samples/prop-accessors/_config.js
@@ -0,0 +1,12 @@
+export default {
+ accessors: false,
+ test({ assert, component }) {
+ assert.equal(component.foo1, 42);
+ assert.equal(component.foo2(), 42);
+ assert.equal(component.bar, undefined);
+ component.foo1 = null;
+ component.foo2 = null;
+ assert.equal(component.foo1, 42);
+ assert.equal(component.foo2(), 42);
+ }
+};
diff --git a/test/runtime/samples/prop-accessors/main.svelte b/test/runtime/samples/prop-accessors/main.svelte
new file mode 100644
index 0000000000..a412ac3e3c
--- /dev/null
+++ b/test/runtime/samples/prop-accessors/main.svelte
@@ -0,0 +1,5 @@
+