def result_contains_repaint_rects(text):
- return isinstance(text, str) and re.search('^\s*\(repaint rects$', text, re.MULTILINE) != None
+ return isinstance(text, str) and (
+ re.search('"repaintRects": \[$', text, re.MULTILINE) != None or
+ text.find('Minimum repaint:') != -1)
+
+
+def extract_layer_tree(input_str):
+ if not isinstance(input_str, str):
+ return '{}'
+
+ if input_str[0:2] == '{\n':
+ start = 0
+ else:
+ start = input_str.find('\n{\n')
+ if start == -1:
+ return '{}'
+
+ end = input_str.find('\n}\n', start)
+ if end == -1:
+ return '{}'
+
+ # FIXME: There may be multiple layer trees in the result.
+ return input_str[start:end + 3]
def generate_repaint_overlay_html(test_name, actual_text, expected_text):
- if not result_contains_repaint_rects(expected_text):
+ if not result_contains_repaint_rects(actual_text) and not result_contains_repaint_rects(expected_text):
return ''
- def make_js_rect(input_str):
- rect_pattern = '\(rect\s+(\d+\.\d+)\s+(\d+\.\d+)\s+(\d+\.\d+)\s+(\d+\.\d+)\)'
- rects = []
- for m in re.finditer(rect_pattern, input_str):
- rects.append('[' + ','.join(m.groups()) + ']')
- return '[' + ','.join(rects) + ']'
-
- # FIXME: Need to consider layer offset and transforms.
- expected_rects = make_js_rect(expected_text)
- actual_rects = make_js_rect(actual_text)
+ expected_layer_tree = extract_layer_tree(expected_text)
+ actual_layer_tree = extract_layer_tree(actual_text)
minimum_repaint = '[]'
minimum_repaint_match = re.search('Minimum repaint:\n(\[.*\n\])', actual_text, re.DOTALL)
#actual, #minimum-repaint {
display: none;
}
- #dump {
- position: absolute;
- top: 80px;
- left: 0;
- z-index: 2;
- display: none;
- }
</style>
</head>
<body>
-<a href="http://crbug.com/381221">Known issues (layer transformations, layer offsets, etc.)</a><br>
+<a href="http://crbug.com/381221">Known issues</a><br>
<label><input id="show-test" type="checkbox" checked onchange="toggle_test(this.checked)">Show test</label>
-<label><input id="show-diff-only" type="checkbox" checked onchange="toggle_diff_only(this.checked)">Diffs only</label>
-<label><input type="checkbox" checked onchange="toggle_hide_duplicate_rects(this.checked)">Hide duplicate rects</label>
-<label><input type="checkbox" onchange="toggle_dump_rects(this.checked)">Dump rects</label>
<label title="See fast/repaint/resources/text-based-repaint.js for how this works">
<input id="show-minimum-repaint" type="checkbox" onchange="toggle_minimum_repaint(this.checked)">Minimum repaint
</label>
<canvas id='minimum-repaint' width='2000' height='2000'></canvas>
<canvas id='expected' width='2000' height='2000'></canvas>
<canvas id='actual' width='2000' height='2000'></canvas>
- <pre id='dump'></pre>
</div>
<script>
-var show_diff_only = true;
-var hide_duplicate_rects = true;
var overlay_opacity = 0.25;
function toggle_test(show_test) {
iframe.style.display = show_test ? 'block' : 'none';
}
-function toggle_diff_only(new_show_diff_only) {
- show_diff_only = new_show_diff_only;
- draw_repaint_rects();
-}
-
-function toggle_hide_duplicate_rects(new_hide_duplicate_rects) {
- hide_duplicate_rects = new_hide_duplicate_rects;
- draw_repaint_rects();
-}
-
-function toggle_dump_rects(dump_rects) {
- document.getElementById('dump').style.display = dump_rects ? 'block' : 'none';
-}
-
function toggle_minimum_repaint(show_minimum_repaint) {
document.getElementById('minimum-repaint').style.display = show_minimum_repaint ? 'block' : 'none';
}
function highlight_under_repaint() {
document.getElementById('show-test').checked = false;
toggle_test(false);
- document.getElementById('show-diff-only').checked = false;
- show_diff_only = false;
document.getElementById('show-minimum-repaint').checked = true;
toggle_minimum_repaint(true);
document.getElementById('use-solid-colors').checked = true;
toggle_solid_color(true);
}
-var original_expected_rects = %(expected_rects)s;
-var original_actual_rects = %(actual_rects)s;
+var expected = %(expected)s;
+var actual = %(actual)s;
var minimum_repaint = %(minimum_repaint)s;
function rectsEqual(rect1, rect2) {
return rect1[0] == rect2[0] && rect1[1] == rect2[1] && rect1[2] == rect2[2] && rect1[3] == rect2[3];
}
-function findDifference(rects1, rects2) {
- for (var i = rects1.length - 1; i >= 0; i--) {
- for (var k = rects2.length - 1; k >= 0; k--) {
- if (rectsEqual(rects1[i], rects2[k])) {
- rects1.splice(i, 1);
- rects2.splice(k, 1);
- break;
- }
- }
+function draw_rects(context, rects) {
+ for (var i = 0; i < rects.length; ++i) {
+ var rect = rects[i];
+ context.fillRect(rect[0], rect[1], rect[2], rect[3]);
}
}
-function removeDuplicateRects(rects) {
- for (var i = rects.length - 1; i > 0; i--) {
- for (var k = i - 1; k >= 0; k--) {
- if (rectsEqual(rects[i], rects[k])) {
- rects.splice(i, 1);
- break;
- }
- }
+function draw_layer_rects(context, result) {
+ context.save();
+ if (result.position)
+ context.translate(result.position[0], result.position[1]);
+ var t = result.transform;
+ if (t) {
+ var origin = result.transformOrigin || [result.bounds[0] / 2, result.bounds[1] / 2];
+ context.translate(origin[0], origin[1]);
+ context.transform(t[0][0], t[0][1], t[1][0], t[1][1], t[3][0], t[3][1]);
+ context.translate(-origin[0], -origin[1]);
}
-}
-
-function draw_rects(context, rects) {
- context.clearRect(0, 0, 2000, 2000);
- for (var i = 0; i < rects.length; i++) {
- var rect = rects[i];
- context.fillRect(rect[0], rect[1], rect[2], rect[3]);
+ if (result.repaintRects)
+ draw_rects(context, result.repaintRects);
+ if (result.children) {
+ for (var i = 0; i < result.children.length; ++i)
+ draw_layer_rects(context, result.children[i]);
}
+ context.restore();
}
var expected_canvas = document.getElementById('expected');
var actual_canvas = document.getElementById('actual');
var minimum_repaint_canvas = document.getElementById('minimum-repaint');
-function dump_rects(rects) {
- var result = '';
- for (var i = 0; i < rects.length; i++)
- result += '(' + rects[i].toString() + ')\\n';
- return result;
-}
-
function draw_repaint_rects() {
- var expected_rects = original_expected_rects.slice(0);
- var actual_rects = original_actual_rects.slice(0);
-
- if (hide_duplicate_rects) {
- removeDuplicateRects(expected_rects);
- removeDuplicateRects(actual_rects);
- }
-
- if (show_diff_only)
- findDifference(expected_rects, actual_rects);
-
- document.getElementById('dump').textContent =
- 'Expected:\\n' + dump_rects(expected_rects)
- + '\\nActual:\\n' + dump_rects(actual_rects)
- + '\\nMinimal:\\n' + dump_rects(minimum_repaint);
-
var expected_ctx = expected_canvas.getContext("2d");
+ expected_ctx.clearRect(0, 0, 2000, 2000);
expected_ctx.fillStyle = 'rgba(255, 0, 0, ' + overlay_opacity + ')';
- draw_rects(expected_ctx, expected_rects);
+ draw_layer_rects(expected_ctx, expected);
var actual_ctx = actual_canvas.getContext("2d");
+ actual_ctx.clearRect(0, 0, 2000, 2000);
actual_ctx.fillStyle = 'rgba(0, 255, 0, ' + overlay_opacity + ')';
- draw_rects(actual_ctx, actual_rects);
+ draw_layer_rects(actual_ctx, actual);
}
function draw_minimum_repaint() {
</html>
""" % {
'title': test_name,
- 'expected_rects': expected_rects,
- 'actual_rects': actual_rects,
+ 'expected': expected_layer_tree,
+ 'actual': actual_layer_tree,
'minimum_repaint': minimum_repaint,
}