| Index: pkg/polymer/lib/elements/web-animations-js/test/test-generator.html
|
| diff --git a/pkg/polymer/lib/elements/web-animations-js/test/test-generator.html b/pkg/polymer/lib/elements/web-animations-js/test/test-generator.html
|
| new file mode 100755
|
| index 0000000000000000000000000000000000000000..7e0740ce7e37580a891374f1f1b9f21e5f53f108
|
| --- /dev/null
|
| +++ b/pkg/polymer/lib/elements/web-animations-js/test/test-generator.html
|
| @@ -0,0 +1,251 @@
|
| +<!--
|
| +Copyright 2012 Google Inc. All Rights Reserved.
|
| +
|
| +Licensed under the Apache License, Version 2.0 (the "License");
|
| +you may not use this file except in compliance with the License.
|
| +You may obtain a copy of the License at
|
| +
|
| + http://www.apache.org/licenses/LICENSE-2.0
|
| +
|
| +Unless required by applicable law or agreed to in writing, software
|
| +distributed under the License is distributed on an "AS IS" BASIS,
|
| +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
| +See the License for the specific language governing permissions and
|
| +limitations under the License.
|
| +-->
|
| +<style>
|
| +iframe {
|
| + width: 100%;
|
| + height: 600px;
|
| +}
|
| +.textBox {
|
| + width:800px;
|
| + height:200px;
|
| +}
|
| +input#iframeSrc {
|
| + width: 200px;
|
| +}
|
| +</style>
|
| +
|
| +<input type="text" id="iframeSrc">
|
| +<button id="load-button" onclick="loadFile()">Load</button><br>
|
| +<iframe id="frame" src=""></iframe>
|
| +<div id="userOptions">
|
| + <input type="number" id="interval" value=1> Interval <br>
|
| + Objects and properties
|
| + <button id="generate-button" onclick="startGeneratingExpectations()">Generate</button><br>
|
| + <textarea id = "obProp" class = textBox></textarea> <br>
|
| +</div>
|
| +<div> Outputted Checks </div>
|
| +<pre id = "checks"></pre>
|
| +
|
| +<script>
|
| +"use strict";
|
| +
|
| +function detectFeatures() {
|
| + var style = document.createElement('style');
|
| + style.textContent = '' +
|
| + 'dummyRuleForTesting {' +
|
| + 'width: calc(0px);' +
|
| + 'width: -webkit-calc(0px); }';
|
| + document.head.appendChild(style);
|
| + var transformCandidates = [
|
| + 'transform',
|
| + 'webkitTransform',
|
| + 'msTransform'
|
| + ];
|
| + var transformProperty = transformCandidates.filter(function(property) {
|
| + return property in style.sheet.cssRules[0].style;
|
| + })[0];
|
| + var calcFunction = style.sheet.cssRules[0].style.width.split('(')[0];
|
| + document.head.removeChild(style);
|
| + return {
|
| + transformProperty: transformProperty,
|
| + calcFunction: calcFunction
|
| + };
|
| +}
|
| +
|
| +var features = detectFeatures();
|
| +
|
| +var testCurrentTime;
|
| +var testLength = 0;
|
| +var lastRun = false;
|
| +var frameTime = 100;
|
| +var checks = [];
|
| +var interval;
|
| +
|
| +document.getElementById("iframeSrc").value = window.location.search.substring(1) || "testcases/auto-test-calc.html";
|
| +document.getElementById("interval").value = "1";
|
| +document.getElementById("obProp").value = ".anim, width";
|
| +
|
| +
|
| +function ToCheck(object, initSelctor, properties){
|
| + this.object = object;
|
| + this.initSelctor = initSelctor;
|
| + this.properties = properties;
|
| +}
|
| +
|
| +function getEndTime(timeline) {
|
| + var players = timeline.getCurrentPlayers();
|
| +
|
| + var endTime = 0;
|
| + players.forEach(function(player) {
|
| + endTime = Math.max(endTime, player.source.endTime);
|
| + });
|
| + return endTime;
|
| +}
|
| +
|
| +function loadFile(mode, callback) {
|
| + if (typeof mode == 'undefined') {
|
| + mode = '';
|
| + }
|
| +
|
| + var file = document.getElementById("iframeSrc").value;
|
| +
|
| + var iframe = document.getElementById("frame");
|
| + // We want the frame to always reload even if the src is the same, hence we
|
| + // force it to null and then to the value we want.
|
| + iframe.onload = function() {
|
| + iframe.onload = callback;
|
| + iframe.src = file + '#' + mode;
|
| + };
|
| + iframe.src = '';
|
| +}
|
| +
|
| +function startGeneratingExpectations() {
|
| + var obProp = document.getElementById("obProp").value;
|
| +
|
| + var output = document.getElementById("checks");
|
| + output.innerHTML = "";
|
| +
|
| + loadFile("message", function () {
|
| + findElementsToCheck(obProp);
|
| +
|
| + output.innerHTML += "timing_test(function() {\n";
|
| + var testWindow = document.getElementById("frame").contentWindow;
|
| + var interval = parseFloat(document.getElementById("interval").value);
|
| +
|
| + var endTime = Infinity;
|
| +
|
| + var t = 0;
|
| + while(t <= endTime) {
|
| + if (typeof testWindow.testharness_timeline == 'undefined') {
|
| + alert("Your page doesn't contain testharness_timline, can not generate anything!");
|
| + return;
|
| + }
|
| +
|
| + testWindow.testharness_timeline.setTime(t * 1000.0);
|
| +
|
| + // Update the endTime as it can change dependent on the running animations
|
| + // and modifications to them.
|
| + endTime = getEndTime(testWindow.window.document.timeline);
|
| +
|
| + generate(t);
|
| + t += interval;
|
| + }
|
| +
|
| + output.innerHTML += '}, "Auto generated tests");\n';
|
| + });
|
| +}
|
| +
|
| +function findElementsToCheck(rawString){
|
| + // Put all checks into checkStack
|
| + checks = [];
|
| + rawString = rawString.split("\n");
|
| +
|
| + for (var x in rawString){
|
| + rawString[x] = rawString[x].replace(/\s/g, "");
|
| + rawString[x] = rawString[x].split(",");
|
| + if (rawString[x][0].length == 0)
|
| + continue;
|
| + var object = window.frames[0].document.querySelectorAll(rawString[x][0]);
|
| + var prop = [];
|
| + for (var i = 1; i < rawString[x].length; i++){
|
| + prop.push(rawString[x][i]);
|
| + }
|
| + checks.push(new ToCheck(object, rawString[x][0], prop));
|
| + }
|
| +}
|
| +
|
| +var svgProperties = {
|
| + 'cx': 1,
|
| + 'width': 1,
|
| + 'x': 1,
|
| + 'y': 1,
|
| +};
|
| +
|
| +var propertyIsSVGAttrib = function(property, target) {
|
| + return target.namespaceURI == 'http://www.w3.org/2000/svg' &&
|
| + property in svgProperties;
|
| +};
|
| +
|
| +function generate(time){
|
| + console.log("Generating checks for t=", time);
|
| +
|
| + // Produce checks at this time
|
| + var outputText = " at(" + time + ", function() {\n";
|
| + for (var x in checks){
|
| + var propslist = [];
|
| + for (var i = 0; i < checks[x].object.length; i++){
|
| + var propsPrint = "{";
|
| + for (var j in checks[x].properties){
|
| + var p = checks[x].properties[j];
|
| + var isSVG = propertyIsSVGAttrib(p, checks[x].object[i]);
|
| +
|
| + if(isSVG) var props = checks[x].object[i].attributes;
|
| + else var props = checks[x].object[i].currentStyle ||
|
| + getComputedStyle(checks[x].object[i], null);
|
| +
|
| + if (p == 'ctm') {
|
| + var ctm = checks[x].object[i].getCTM();
|
| + var value = '{' + ctm.a + ', ' + ctm.b + ', ' + ctm.c + ', ' + ctm.d + ', ' + ctm.e + ', ' + ctm.f + '}'
|
| + } else if (p == 'transform') {
|
| + var value = props[features.transformProperty];
|
| + } else {
|
| + var value = isSVG ? props[p].value : props[p];
|
| + }
|
| + console.log("Node:", checks[x].object[i].cloneNode(), "Property:", checks[x].properties[j], "Value:", value);
|
| +
|
| + value = value.replace(/[-+]?[0-9]+\.?[0-9]*(?:[eE][-+]?[0-9]+)?/g, function(v) {
|
| + v = Number(v);
|
| + if (Math.abs(v) < 1e-10) {
|
| + v = 0;
|
| + }
|
| + return ("" + v.toPrecision(4)).replace(/\.?0+$/, '');
|
| + });
|
| +
|
| + propsPrint += "'"+ p + "':'" + value + "'";
|
| + if (j < checks[x].properties.length -1) propsPrint += ",";
|
| + }
|
| + propsPrint += "}";
|
| + propslist.push(propsPrint);
|
| + }
|
| + outputText += printCheck(checks[x].initSelctor, i, propslist, time);
|
| + }
|
| + outputText += ' });';
|
| + var output = document.getElementById("checks");
|
| + output.innerHTML += outputText + "<br>";
|
| +}
|
| +
|
| +function printCheck(object, number, properties, time){
|
| +
|
| + var newCheck = ' assert_styles("' + object + '",';
|
| +
|
| + // If all the properties are the same for every object, just pass the list.
|
| + var allsame = properties.every(function(x) { return x === properties[0] });
|
| + if (allsame) {
|
| + newCheck += properties[0] + ");\n";
|
| +
|
| + } else {
|
| + // Otherwise give a list with each
|
| +
|
| + newCheck += " [\n";
|
| + for (var j in properties) {
|
| + newCheck += ' ' + properties[j] + ",\n";
|
| + }
|
| + newCheck += " ]);\n";
|
| + }
|
| +
|
| + return newCheck;
|
| +}
|
| +</script>
|
|
|