window dimension bindings

src/compile/render-dom/index.ts

@@ -199,7 +199,7 @@ export default function dom(
 				}
 			`);
 
-			if (component.writable_declarations.has(x.as)) {
+			if (component.writable_declarations.has(x.as) && !renderer.readonly.has(x.as)) {
 				body.push(deindent`
 					set ${x.as}(value) {
 						this.$set({ ${x.name}: value });

src/compile/render-dom/wrappers/Window.ts

@@ -109,30 +109,25 @@ export default class WindowWrapper extends Wrapper {
 				});
 			}
 
-			const handler_body = deindent`
+			component.declarations.push(handler_name);
+			component.partly_hoisted.push(deindent`
+				function ${handler_name}() {
 					${event === 'scroll' && deindent`
 						if (${lock}) return;
 						${lock} = true;
 					`}
-				${component.options.dev && `component._updatingReadonlyProperty = true;`}
+					${props.map(prop => `${prop.name} = window.${prop.value}; $$make_dirty('${prop.name}');`)}
-
-				#component.set({
-					${props.map(prop => `${prop.name}: this.${prop.value}`)}
-				});
-
-				${component.options.dev && `component._updatingReadonlyProperty = false;`}
 					${event === 'scroll' && `${lock} = false;`}
-			`;
+				}
+			`);
 
 			block.builders.init.addBlock(deindent`
-				function ${handler_name}(event) {
+				window.addEventListener("${event}", ctx.${handler_name});
-					${handler_body}
+				@after_render(ctx.${handler_name});
-				}
-				window.addEventListener("${event}", ${handler_name});
 			`);
 
 			block.builders.destroy.addBlock(deindent`
-				window.removeEventListener("${event}", ${handler_name});
+				window.removeEventListener("${event}", ctx.${handler_name});
 			`);
 		});
 

test/runtime/samples/dev-warning-readonly-window-binding/_config.js

@@ -1,14 +1,16 @@
 export default {
+	solo: 1,
+
 	compileOptions: {
 		dev: true
 	},
 
-	test ( assert, component ) {
+	test(assert, component) {
 		try {
 			component.width = 99;
-			throw new Error( 'Expected an error' );
+			throw new Error('Expected an error');
-		} catch ( err ) {
+		} catch (err) {
-			assert.equal( err.message, `<Main$>: Cannot set read-only property 'width'` );
+			assert.equal(err.message, `<Main$>: Cannot set read-only property 'width'`);
 		}
 	}
 };