AshleyGrant/app.html

## app.html
<template>
  See console
  <button click.delegate="change()">Change</button>
</template>

## app.js
export class App {
  constructor(bindingEngine) {
      console.clear()

      delete window.count1;
      console.log('deleted window.count1');

      delete window.count2;
      console.log('deleted window.count2');

      delete window.count3;
      console.log('deleted window.count3');
  }

  change() {
    count++;
    count2++;
    count3++;
  }
}

## index.html
<!doctype html>
<html>
  <head>
    <title>Aurelia</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
  </head>
  <body aurelia-app>
    <h1>Loading...</h1>
    <script>
      "use strict";
      count1 = 0;
      window.count2 = 0;
      var count3 = 0;

      console.clear()
      console.log('\BEFORE');
      console.log('window.count1: ' + window.count1);
      console.log('window.count2: ' + window.count2);
      console.log('window.count3: ' + window.count3);

      delete window.count1;
      delete window.count2;
      delete window.count3;

      console.log('\nAFTER');
      console.log('window.count1: ' + window.count1);
      console.log('window.count2: ' + window.count2);
      console.log('window.count3: ' + window.count3);

      //---
      var obj = window;

      count4 = 0;
      window.count5 = 0;
      var count6 = 0;

      console.log('\BEFORE');
      console.log('window.count4: ' + window.count4);
      console.log('window.count5: ' + window.count5);
      console.log('window.count6: ' + window.count6);

      var definedCount4 = Reflect.defineProperty(obj, "count4", {value: 7});
      var definedCount5 = Reflect.defineProperty(obj, "count5", {value: 7});
      var definedCount6 = Reflect.defineProperty(obj, "count6", {value: 7});

      console.log('\nAFTER');
      console.log('definedCount4: ' + definedCount4);
      console.log('definedCount5: ' + definedCount5);
      console.log('definedCount6: ' + definedCount6);
    </script>
  </body>
</html>
	<template>
	See console
	<button click.delegate="change()">Change</button>
	</template>
	export class App {
	constructor(bindingEngine) {
	console.clear()

	delete window.count1;
	console.log('deleted window.count1');

	delete window.count2;
	console.log('deleted window.count2');

	delete window.count3;
	console.log('deleted window.count3');
	}

	change() {
	count++;
	count2++;
	count3++;
	}
	}
	<!doctype html>
	<html>
	<head>
	<title>Aurelia</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	</head>
	<body aurelia-app>
	<h1>Loading...</h1>
	<script>
	"use strict";
	count1 = 0;
	window.count2 = 0;
	var count3 = 0;

	console.clear()
	console.log('\BEFORE');
	console.log('window.count1: ' + window.count1);
	console.log('window.count2: ' + window.count2);
	console.log('window.count3: ' + window.count3);

	delete window.count1;
	delete window.count2;
	delete window.count3;

	console.log('\nAFTER');
	console.log('window.count1: ' + window.count1);
	console.log('window.count2: ' + window.count2);
	console.log('window.count3: ' + window.count3);

	//---
	var obj = window;

	count4 = 0;
	window.count5 = 0;
	var count6 = 0;

	console.log('\BEFORE');
	console.log('window.count4: ' + window.count4);
	console.log('window.count5: ' + window.count5);
	console.log('window.count6: ' + window.count6);

	var definedCount4 = Reflect.defineProperty(obj, "count4", {value: 7});
	var definedCount5 = Reflect.defineProperty(obj, "count5", {value: 7});
	var definedCount6 = Reflect.defineProperty(obj, "count6", {value: 7});

	console.log('\nAFTER');
	console.log('definedCount4: ' + definedCount4);
	console.log('definedCount5: ' + definedCount5);
	console.log('definedCount6: ' + definedCount6);
	</script>
	</body>
	</html>