Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(15)

Unified Diff: third_party/WebKit/LayoutTests/inspector/sass/test-ast-diff-1.html

Issue 1504923008: DevTools: [SASS] implement AST differ. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@sass-module-2
Patch Set: Created 5 years ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: third_party/WebKit/LayoutTests/inspector/sass/test-ast-diff-1.html
diff --git a/third_party/WebKit/LayoutTests/inspector/sass/test-ast-diff-1.html b/third_party/WebKit/LayoutTests/inspector/sass/test-ast-diff-1.html
new file mode 100644
index 0000000000000000000000000000000000000000..c549033aece5f4f8652b3cfa5b74d9e00cd116cb
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/inspector/sass/test-ast-diff-1.html
@@ -0,0 +1,121 @@
+<html>
+<head>
+<script src="../../http/tests/inspector/inspector-test.js"></script>
+<script src="../../http/tests/inspector/elements-test.js"></script>
+<script src="./sass-test.js"></script>
+<style>
+pre {
+ font-family: monospace;
+}
+</style>
+<script>
+
+function test()
+{
+ var parseCSS = InspectorTest.parseCSS.bind(InspectorTest, "");
+ var loadCSS = InspectorTest.evaluateInPagePromise.bind(InspectorTest);
+ var ast1, ast2;
+
+ loadCSS("getCSS('.initial')")
+ .then(result => parseCSS(result.value))
+ .then(ast => ast1 = ast)
+ .then(() => loadCSS("getCSS('.changed')"))
+ .then(result => parseCSS(result.value))
+ .then(ast => ast2 = ast)
+ .then(onParsed)
+ .catch(error => console.error(error))
+ .then(InspectorTest.completeTest);
+
+ function onParsed()
+ {
+ var diff = WebInspector.SASSSupport.diffModels(ast1, ast2);
+ InspectorTest.dumpASTDiff(diff);
+ }
+
+}
+
+function getCSS(className)
+{
+ return document.querySelector(className).textContent;
+}
+
+</script>
+</head>
+
+<body onload="runTest()">
+<p>
+Verifies CSS AST property diff.
+</p>
+<pre class="initial">
+.change-property-name {
+ color: red;
+}
+
+.change-property-value::before {
+ margin: 10px 10px;
+}
+
+.change-inside-disabled-property {
+ /* width: 100px; */
+}
+
+.toggle-property {
+ border: 1px solid black;
+}
+
+.add-property {
+ font-family: "Arial";
+}
+
+.remove-property {
+ display: inline-flex;
+ position: static;
+}
+
+.complex-composite-change {
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ display: flex;
+ /* align-items: center; */
+}
+</pre>
+<pre class="changed">
+.change-property-name {
+ background: red;
+}
+
+.change-property-value::before {
+ margin: 10px 0 0 10px;
+}
+
+.change-inside-disabled-property {
+ /* height: 10px; */
+}
+
+.toggle-property {
+ /* border: 1px solid black; */
+}
+
+.add-property {
+ font-family: "Arial";
+ font-size: 16px;
+}
+
+.remove-property {
+ display: inline-flex;
+}
+
+.complex-composite-change {
+ /* position: absolute; */
+ left: 10px;
+ margin: 0;
+ padding: 22px;
+ display: flex;
+ align-items: center;
+}
+</pre>
+</body>
+</html>

Powered by Google App Engine
This is Rietveld 408576698