third_party/WebKit/LayoutTests/http/tests/inspector/stylesheet-source-mapping.html

   1 <html>
   2 <head>
   3 <script src="inspector-test.js"></script>
   4 <script src="debugger-test.js"></script>
   5 <script src="workspace-test.js"></script>
   6
   7 <script>
   8
   9 function test()
  10 {
  11     var contentReceived;
  12     var finalMappedLocation;
  13     var target = InspectorTest.createWorkspaceWithTarget();
  14     var cssModel = WebInspector.CSSStyleModel.fromTarget(target);
  15     WebInspector.cssWorkspaceBinding = InspectorTest.testCSSWorkspaceBinding;
  16
  17     InspectorTest.waitForWorkspaceUISourceCodeAddedEvent(cssUISourceCodeAdded);
  18     const styleSheetURL = "http://localhost:8000/inspector/resources/example.css";
  19     const sourceMapURL = "example.css.map";
  20     const styleSheetId = 1;
  21     InspectorTest.addMockUISourceCodeToWorkspace(styleSheetURL, WebInspector.resourceTypes.Stylesheet, "");
  22
  23     InspectorTest.addSniffer(WebInspector.CSSWorkspaceBinding.prototype, "updateLocations", locationsUpdated, true);
  24     cssModel._styleSheetAdded(createMockStyleSheetHeader(styleSheetURL, sourceMapURL));
  25
  26     function locationsUpdated()
  27     {
  28         var uiLocation = InspectorTest.testCSSWorkspaceBinding.rawLocationToUILocation(new WebInspector.CSSLocation(cssModel, styleSheetId, styleSheetURL, 2, 3));
  29         var networkURL = InspectorTest.testNetworkMapping.networkURL(uiLocation.uiSourceCode);
  30         if (networkURL.indexOf(".scss") === -1)
  31             return;
  32         finalMappedLocation = networkURL + ":" + uiLocation.lineNumber + ":" + uiLocation.columnNumber;
  33         join();
  34     }
  35
  36
  37     function createMockStyleSheetHeader(url, sourceMapURL)
  38     {
  39         const frame = InspectorTest.resourceTreeModel.mainFrame;
  40         return {
  41             styleSheetId: styleSheetId,
  42             frameId: frame.id,
  43             sourceURL: url,
  44             sourceMapURL: sourceMapURL,
  45             origin: "regular",
  46             title: "",
  47             disabled: false
  48         };
  49     }
  50
  51     function createMockStyleSheetResource(url, mimeType, content)
  52     {
  53         const documentURL = "http://localhost:8000/inspector/stylesheet-source-mapping.html";
  54         const frame = InspectorTest.resourceTreeModel.mainFrame;
  55         var resource = new WebInspector.Resource(target, null, url, documentURL, frame.id, frame.loaderId, WebInspector.resourceTypes.Stylesheet, mimeType);
  56         resource.requestContent = function(callback)
  57         {
  58             callback(content, false, mimeType);
  59         }
  60         return resource;
  61     }
  62
  63
  64     function cssUISourceCodeAdded(uiSourceCode)
  65     {
  66         InspectorTest.addResult("Added CSS uiSourceCode: " + uiSourceCode.uri());
  67         InspectorTest.waitForWorkspaceUISourceCodeAddedEvent(scssUISourceCodeAdded);
  68     }
  69
  70     function scssUISourceCodeAdded(uiSourceCode)
  71     {
  72         InspectorTest.addResult("Added SCSS uiSourceCode: " + uiSourceCode.uri());
  73         afterStyleSheetAdded();
  74     }
  75
  76     function rawLocationToUILocation(line, column)
  77     {
  78         return InspectorTest.testCSSWorkspaceBinding.rawLocationToUILocation(new WebInspector.CSSLocation(cssModel, styleSheetId, styleSheetURL, line, column));
  79     }
  80
  81     function afterStyleSheetAdded()
  82     {
  83         var cssUISourceCode = InspectorTest.testWorkspace.uiSourceCodeForOriginURL(styleSheetURL);
  84         var scssUISourceCode = InspectorTest.testWorkspace.uiSourceCodeForOriginURL("http://localhost:8000/inspector/resources/example.scss");
  85
  86         InspectorTest.checkUILocation(cssUISourceCode, 0, 3, rawLocationToUILocation(0, 3));
  87         InspectorTest.checkUILocation(scssUISourceCode, 1, 0, rawLocationToUILocation(1, 0));
  88         InspectorTest.checkUILocation(scssUISourceCode, 2, 2, rawLocationToUILocation(2, 4));
  89         InspectorTest.checkUILocation(scssUISourceCode, 2, 5, rawLocationToUILocation(2, 6));
  90         InspectorTest.checkUILocation(scssUISourceCode, 2, 7, rawLocationToUILocation(2, 9));
  91         InspectorTest.checkUILocation(scssUISourceCode, 2, 10, rawLocationToUILocation(3, 7));
  92         InspectorTest.checkUILocation(scssUISourceCode, 4, 2, rawLocationToUILocation(4, 8));
  93         InspectorTest.checkUILocation(scssUISourceCode, 4, 2, rawLocationToUILocation(4, 10));
  94         InspectorTest.checkUILocation(scssUISourceCode, 4, 11, rawLocationToUILocation(4, 11));
  95         InspectorTest.checkUILocation(scssUISourceCode, 4, 13, rawLocationToUILocation(4, 15));
  96         InspectorTest.checkUILocation(scssUISourceCode, 4, 17, rawLocationToUILocation(4, 20));
  97         scssUISourceCode.requestContent(didRequestContent);
  98
  99         function didRequestContent(content, contentEncoded, mimeType)
 100         {
 101             InspectorTest.assertEquals(0, content.indexOf("/* Comment */"));
 102             contentReceived = true;
 103             join();
 104         }
 105     }
 106
 107     function join()
 108     {
 109         if (!contentReceived || !finalMappedLocation)
 110             return;
 111         InspectorTest.addResult("UILocation upon LiveLocation update: " + finalMappedLocation);
 112         InspectorTest.completeTest();
 113     }
 114 }
 115
 116 </script>
 117
 118 </head>
 119
 120 <body onload="runTest()">
 121 <p>Tests SourceMap and StyleSheetMapping.</p>
 122 </body>
 123 </html>