ionelmc/index.html

## index.html
<!DOCTYPE html>
<html>
<head>
  <script src="http://ionelmc.github.io/polymer-json-box/bower_components/platform/platform.js"></script>
  <script src="http://ionelmc.github.io/polymer-json-box/bower_components/polymer/polymer.js"></script>
  <meta charset="UTF-8">
  <style>
  </style>
</head>
<body unresolved>
  <template id="result" is="auto-binding">
    <template if="{{ data.length }}">
      <template repeat="{{ item in data|changestuff }}">
        item: {{ item|json }}
        <br>
      </template>
    </template>
    <p>items: {{ data.length && data|json }}</p>
    <p>items(buggy): {{ data|json }}</p>

  </template>
  <button onclick="result.data.splice(0, 1)">bug?</button>
  <button onclick="result.data = result.data">assign?</button>
  <button onclick="Platform.flush()">flush?</button>

  <script>
    var result;
    window.addEventListener('polymer-ready', function() {
      result = document.getElementById('result');
      result.json = function(val) { return JSON.stringify(val); };
      result.changestuff = function(val) {
        return val.map(function(val) { return val+1; });
      };
      result.data = [
        1,
        2,
        3,
        4,
        5,
      ];
    });
  </script>

<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
<html>
<head>
  <script src="http://ionelmc.github.io/polymer-json-box/bower_components/platform/platform.js"><\/script>
  <script src="http://ionelmc.github.io/polymer-json-box/bower_components/polymer/polymer.js"><\/script>
  <meta charset="UTF-8">
  <style>
  </style>
</head>
<body unresolved>
  <template id="result" is="auto-binding">
    <template if="{{ data.length }}">
      <template repeat="{{ item in data|changestuff }}">
        item: {{ item|json }}
        <br>
      </template>
    </template>
    <p>items: {{ data.length && data|json }}</p>
    <p>items(buggy): {{ data|json }}</p>

  </template>
  <button onclick="result.data.splice(0, 1)">bug?</button>
  <button onclick="result.data = result.data">assign?</button>
  <button onclick="Platform.flush()">flush?</button>

  <script>
    var result;
    window.addEventListener('polymer-ready', function() {
      result = document.getElementById('result');
      result.json = function(val) { return JSON.stringify(val); };
      result.changestuff = function(val) {
        return val.map(function(val) { return val+1; });
      };
      result.data = [
        1,
        2,
        3,
        4,
        5,
      ];
    });
  <\/script>
</body>
</html> </script>

</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<script src="http://ionelmc.github.io/polymer-json-box/bower_components/platform/platform.js"></script>
	<script src="http://ionelmc.github.io/polymer-json-box/bower_components/polymer/polymer.js"></script>
	<meta charset="UTF-8">
	<style>
	</style>
	</head>
	<body unresolved>
	<template id="result" is="auto-binding">
	<template if="{{ data.length }}">
	<template repeat="{{ item in data\|changestuff }}">
	item: {{ item\|json }}
	<br>
	</template>
	</template>
	<p>items: {{ data.length && data\|json }}</p>
	<p>items(buggy): {{ data\|json }}</p>

	</template>
	<button onclick="result.data.splice(0, 1)">bug?</button>
	<button onclick="result.data = result.data">assign?</button>
	<button onclick="Platform.flush()">flush?</button>

	<script>
	var result;
	window.addEventListener('polymer-ready', function() {
	result = document.getElementById('result');
	result.json = function(val) { return JSON.stringify(val); };
	result.changestuff = function(val) {
	return val.map(function(val) { return val+1; });
	};
	result.data = [
	1,
	2,
	3,
	4,
	5,
	];
	});
	</script>

	<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
	<html>
	<head>
	<script src="http://ionelmc.github.io/polymer-json-box/bower_components/platform/platform.js"><\/script>
	<script src="http://ionelmc.github.io/polymer-json-box/bower_components/polymer/polymer.js"><\/script>
	<meta charset="UTF-8">
	<style>
	</style>
	</head>
	<body unresolved>
	<template id="result" is="auto-binding">
	<template if="{{ data.length }}">
	<template repeat="{{ item in data\|changestuff }}">
	item: {{ item\|json }}
	<br>
	</template>
	</template>
	<p>items: {{ data.length && data\|json }}</p>
	<p>items(buggy): {{ data\|json }}</p>

	</template>
	<button onclick="result.data.splice(0, 1)">bug?</button>
	<button onclick="result.data = result.data">assign?</button>
	<button onclick="Platform.flush()">flush?</button>

	<script>
	var result;
	window.addEventListener('polymer-ready', function() {
	result = document.getElementById('result');
	result.json = function(val) { return JSON.stringify(val); };
	result.changestuff = function(val) {
	return val.map(function(val) { return val+1; });
	};
	result.data = [
	1,
	2,
	3,
	4,
	5,
	];
	});
	<\/script>
	</body>
	</html> </script>

	</body>
	</html>