/third_party/WebKit/LayoutTests/inspector/elements/styles-4/styles-formatting.html

https://gitlab.com/jonnialva90/iridium-browser · HTML · 283 lines · 234 code · 49 blank · 0 comment · 0 complexity · 3a40409bcf1e64360d8f0652c3b3dfb0 MD5 · raw file 

    

  1. <html>
    2. 

  2. <head>
    3. 

  3. 

  4. <script src="../../../http/tests/inspector/inspector-test.js"></script>
    5. 

  5. <script src="../../../http/tests/inspector/elements-test.js"></script>
    6. 

  6. <script>
    7. 

  7. 

  8. function test()
    9. 

  9. {
    10. 

  10.     var formattedStyle;
    11. 

  11.     var unformattedStyle;
    12. 

  12. 

  13.     InspectorTest.runTestSuite([
    14. 

  14.         function initFormattedStyle(next)
    15. 

  15.         {
    16. 

  16.             function callback(matchedResult)
    17. 

  17.             {
    18. 

  18.                 if (!matchedResult) {
    19. 

  19.                     InspectorTest.addResult("empty styles");
    20. 

  20.                     InspectorTest.completeTest();
    21. 

  21.                     return;
    22. 

  22.                 }
    23. 

  23. 

  24.                 formattedStyle = matchedResult.nodeStyles()[1];
    25. 

  25.                 next();
    26. 

  26.             }
    27. 

  27. 

  28.             function nodeCallback(node)
    29. 

  29.             {
    30. 

  30.                 InspectorTest.cssModel.matchedStylesPromise(node.id).then(callback);
    31. 

  31.             }
    32. 

  32.             InspectorTest.selectNodeWithId("formatted", nodeCallback);
    33. 

  33.         },
    34. 

  34. 

  35.         function testFormattedInsertStart(next)
    36. 

  36.         {
    37. 

  37.             formattedStyle.insertPropertyAt(0, "firstProperty", "rgba(1, 2, 3, 0)", dumpFormattedAndCallNext.bind(null, next));
    38. 

  38.         },
    39. 

  39. 

  40.         function testFormattedRemoveStart(next)
    41. 

  41.         {
    42. 

  42.             formattedStyle.allProperties[0].setText("", true, true)
    43. 

  43.                 .then(dumpFormattedAndCallNext.bind(null, next));
    44. 

  44.         },
    45. 

  45. 

  46.         function testFormattedInsertMiddle(next)
    47. 

  47.         {
    48. 

  48.             formattedStyle.insertPropertyAt(1, "middleProperty", "middleValue /* comment */", dumpFormattedAndCallNext.bind(null, next));
    49. 

  49.         },
    50. 

  50. 

  51.         function testFormattedRemoveMiddle(next)
    52. 

  52.         {
    53. 

  53.             formattedStyle.allProperties[1].setText("", true, true)
    54. 

  54.                 .then(dumpFormattedAndCallNext.bind(null, next));
    55. 

  55.         },
    56. 

  56. 

  57.         function testFormattedInsertEnd(next)
    58. 

  58.         {
    59. 

  59.             formattedStyle.insertPropertyAt(3, "endProperty", "endValue", dumpFormattedAndCallNext.bind(null, next));
    60. 

  60.         },
    61. 

  61. 

  62.         function testFormattedRemoveEnd(next)
    63. 

  63.         {
    64. 

  64.             formattedStyle.allProperties[3].setText("", true, true)
    65. 

  65.                 .then(dumpFormattedAndCallNext.bind(null, next));
    66. 

  66.         },
    67. 

  67. 

  68.         function testFormattedDisableStart(next)
    69. 

  69.         {
    70. 

  70.             formattedStyle.allProperties[0].setDisabled(true)
    71. 

  71.                 .then(dumpFormattedAndCallNext.bind(null, next));
    72. 

  72.         },
    73. 

  73. 

  74.         function testFormattedDisableEnd(next)
    75. 

  75.         {
    76. 

  76.             formattedStyle.allProperties[2].setDisabled(true)
    77. 

  77.                 .then(dumpFormattedAndCallNext.bind(null, next));
    78. 

  78.         },
    79. 

  79. 

  80.         function testFormattedDisableMiddle(next)
    81. 

  81.         {
    82. 

  82.             formattedStyle.allProperties[1].setDisabled(true)
    83. 

  83.                 .then(dumpFormattedAndCallNext.bind(null, next));
    84. 

  84.         },
    85. 

  85. 

  86.         function testFormattedInsert1(next)
    87. 

  87.         {
    88. 

  88.             formattedStyle.insertPropertyAt(0, "propA", "valA", dumpFormattedAndCallNext.bind(null, next));
    89. 

  89.         },
    90. 

  90. 

  91.         function testFormattedInsert2(next)
    92. 

  92.         {
    93. 

  93.             formattedStyle.insertPropertyAt(2, "propB", "valB", dumpFormattedAndCallNext.bind(null, next));
    94. 

  94.         },
    95. 

  95. 

  96.         function testFormattedInsert3(next)
    97. 

  97.         {
    98. 

  98.             formattedStyle.insertPropertyAt(5, "propC", "valC", dumpFormattedAndCallNext.bind(null, next));
    99. 

  99.         },
    100. 

  100. 

  101.         function testFormattedEnableStart(next)
    102. 

  102.         {
    103. 

  103.             formattedStyle.allProperties[1].setDisabled(false)
    104. 

  104.                 .then(dumpFormattedAndCallNext.bind(null, next));
    105. 

  105.         },
    106. 

  106. 

  107.         function testFormattedEnableEnd(next)
    108. 

  108.         {
    109. 

  109.             formattedStyle.allProperties[4].setDisabled(false)
    110. 

  110.                 .then(dumpFormattedAndCallNext.bind(null, next));
    111. 

  111.         },
    112. 

  112. 

  113.         function testFormattedEnableMiddle(next)
    114. 

  114.         {
    115. 

  115.             formattedStyle.allProperties[3].setDisabled(false)
    116. 

  116.                 .then(dumpFormattedAndCallNext.bind(null, next));
    117. 

  117.         },
    118. 

  118. 

  119.         function testFormattedWithMeta(next)
    120. 

  120.         {
    121. 

  121.             formattedStyle.insertPropertyAt(0, "-webkit-animation", "linear", dumpFormattedAndCallNext.bind(null, next));
    122. 

  122.         },
    123. 

  123. 

  124.         function testFormattedWithMetaValue(next)
    125. 

  125.         {
    126. 

  126.             formattedStyle.insertPropertyAt(1, "unicode-bidi", "webkit-isolate", dumpFormattedAndCallNext.bind(null, next));
    127. 

  127.         },
    128. 

  128. 

  129.         function testFormattedWithAtoms(next)
    130. 

  130.         {
    131. 

  131.             formattedStyle.insertPropertyAt(0, "border-left", "1px solid rgb(1,1,1)", dumpFormattedAndCallNext.bind(null, next));
    132. 

  132.         },
    133. 

  133. 

  134.         function initUnformattedStyle(next)
    135. 

  135.         {
    136. 

  136.             function callback(matchedResult)
    137. 

  137.             {
    138. 

  138.                 if (!matchedResult) {
    139. 

  139.                     InspectorTest.addResult("empty styles");
    140. 

  140.                     InspectorTest.completeTest();
    141. 

  141.                     return;
    142. 

  142.                 }
    143. 

  143. 

  144.                 unformattedStyle = matchedResult.nodeStyles()[1];
    145. 

  145.                 next();
    146. 

  146.             }
    147. 

  147. 

  148.             function nodeCallback(node)
    149. 

  149.             {
    150. 

  150.                 InspectorTest.cssModel.matchedStylesPromise(node.id).then(callback);
    151. 

  151.             }
    152. 

  152.             InspectorTest.selectNodeWithId("unformatted", nodeCallback);
    153. 

  153.         },
    154. 

  154. 

  155.         function testUnformattedInsertStart(next)
    156. 

  156.         {
    157. 

  157.             unformattedStyle.insertPropertyAt(0, "firstProperty", "firstValue", dumpUnformattedAndCallNext.bind(null, next));
    158. 

  158.         },
    159. 

  159. 

  160.         function testUnformattedRemoveStart(next)
    161. 

  161.         {
    162. 

  162.             unformattedStyle.allProperties[0].setText("", true, true)
    163. 

  163.                 .then(dumpUnformattedAndCallNext.bind(null, next));
    164. 

  164.         },
    165. 

  165. 

  166.         function testUnformattedInsertMiddle(next)
    167. 

  167.         {
    168. 

  168.             unformattedStyle.insertPropertyAt(1, "middleProperty", "middleValue", dumpUnformattedAndCallNext.bind(null, next));
    169. 

  169.         },
    170. 

  170. 

  171.         function testUnformattedRemoveMiddle(next)
    172. 

  172.         {
    173. 

  173.             unformattedStyle.allProperties[1].setText("", true, true)
    174. 

  174.                 .then(dumpUnformattedAndCallNext.bind(null, next));
    175. 

  175.         },
    176. 

  176. 

  177.         function testUnformattedInsertEnd(next)
    178. 

  178.         {
    179. 

  179.             unformattedStyle.insertPropertyAt(3, "endProperty", "endValue", dumpUnformattedAndCallNext.bind(null, next));
    180. 

  180.         },
    181. 

  181. 

  182.         function testUnformattedRemoveEnd(next)
    183. 

  183.         {
    184. 

  184.             unformattedStyle.allProperties[3].setText("", true, true)
    185. 

  185.                 .then(dumpUnformattedAndCallNext.bind(null, next));
    186. 

  186.         },
    187. 

  187. 

  188.         function testUnformattedDisableStart(next)
    189. 

  189.         {
    190. 

  190.             unformattedStyle.allProperties[0].setDisabled(true)
    191. 

  191.                 .then(dumpUnformattedAndCallNext.bind(null, next));
    192. 

  192.         },
    193. 

  193. 

  194.         function testUnformattedDisableEnd(next)
    195. 

  195.         {
    196. 

  196.             unformattedStyle.allProperties[2].setDisabled(true)
    197. 

  197.                 .then(dumpUnformattedAndCallNext.bind(null, next));
    198. 

  198.         },
    199. 

  199. 

  200.         function testUnformattedDisableMiddle(next)
    201. 

  201.         {
    202. 

  202.             unformattedStyle.allProperties[1].setDisabled(true)
    203. 

  203.                 .then(dumpUnformattedAndCallNext.bind(null, next));
    204. 

  204.         },
    205. 

  205. 

  206.         function testUnformattedEnableStart(next)
    207. 

  207.         {
    208. 

  208.             unformattedStyle.allProperties[0].setDisabled(false)
    209. 

  209.                 .then(dumpUnformattedAndCallNext.bind(null, next));
    210. 

  210.         },
    211. 

  211. 

  212.         function testUnformattedEnableEnd(next)
    213. 

  213.         {
    214. 

  214.             unformattedStyle.allProperties[2].setDisabled(false)
    215. 

  215.                 .then(dumpUnformattedAndCallNext.bind(null, next));
    216. 

  216.         },
    217. 

  217. 

  218.         function testUnformattedEnableMiddle(next)
    219. 

  219.         {
    220. 

  220.             unformattedStyle.allProperties[1].setDisabled(false)
    221. 

  221.                 .then(dumpUnformattedAndCallNext.bind(null, next));
    222. 

  222.         }
    223. 

  223.     ]);
    224. 

  224. 

  225.     // Data dumping
    226. 

  226. 

  227.     function dumpFormattedAndCallNext(next, success)
    228. 

  228.     {
    229. 

  229.         if (!success) {
    230. 

  230.             InspectorTest.addResult("error: operation failed.");
    231. 

  231.             InspectorTest.completeTest();
    232. 

  232.             return;
    233. 

  233.         }
    234. 

  234. 

  235.         dumpStyle(formattedStyle);
    236. 

  236.         if (next)
    237. 

  237.             next();
    238. 

  238.     }
    239. 

  239. 

  240.     function dumpUnformattedAndCallNext(next, success)
    241. 

  241.     {
    242. 

  242.         if (!success) {
    243. 

  243.             InspectorTest.addResult("error: operation failed.");
    244. 

  244.             InspectorTest.completeTest();
    245. 

  245.             return;
    246. 

  246.         }
    247. 

  247. 

  248.         dumpStyle(unformattedStyle);
    249. 

  249.         if (next)
    250. 

  250.             next();
    251. 

  251.     }
    252. 

  252. 

  253.     function dumpStyle(style)
    254. 

  254.     {
    255. 

  255.         if (!style)
    256. 

  256.             return;
    257. 

  257.         InspectorTest.addResult("raw cssText:");
    258. 

  258.         InspectorTest.addResult("{" + style.cssText + "}");
    259. 

  259.     }
    260. 

  260. }
    261. 

  261. </script>
    262. 

  262. 

  263. <style>
    264. 

  264. 

  265. #formatted { 
    266. 

  266.     property1: value1;
    267. 

  267.     property2: value2;
    268. 

  268.     property3: value3
    269. 

  269. }
    270. 

  270. 

  271. #unformatted {property1:value1;property2:value2;property3:value3;}
    272. 

  272. 

  273. </style>
    274. 

  274. </head>
    275. 

  275. 

  276. <body id="mainBody" onload="runTest()">
    277. 

  277. <p>
    278. 

  278. Tests that InspectorCSSAgent formats the CSS style text based on the CSS model modifications.
    279. 

  279. </p>
    280. 

  280. <div id="formatted">Formatted</div>
    281. 

  281. <div id="unformatted">Unformatted</div>
    282. 

  282. </body>
    283. 

  283. </html>
    284.