michael@0: /* vim: set ts=2 et sw=2 tw=80: */
michael@0: /* Any copyright is dedicated to the Public Domain.
michael@0:    http://creativecommons.org/publicdomain/zero/1.0/ */
michael@0: 
michael@0: // https rather than chrome to improve coverage
michael@0: const TESTCASE_URI = TEST_BASE_HTTPS + "sourcemaps.html";
michael@0: const PREF = "devtools.styleeditor.source-maps-enabled";
michael@0: 
michael@0: 
michael@0: const contents = {
michael@0:   "sourcemaps.scss": [
michael@0:     "",
michael@0:     "$paulrougetpink: #f06;",
michael@0:     "",
michael@0:     "div {",
michael@0:     "  color: $paulrougetpink;",
michael@0:     "}",
michael@0:     "",
michael@0:     "span {",
michael@0:     "  background-color: #EEE;",
michael@0:     "}"
michael@0:   ].join("\n"),
michael@0:   "contained.scss": [
michael@0:     "$pink: #f06;",
michael@0:     "",
michael@0:     "#header {",
michael@0:     "  color: $pink;",
michael@0:     "}"
michael@0:   ].join("\n"),
michael@0:   "sourcemaps.css": [
michael@0:     "div {",
michael@0:     "  color: #ff0066; }",
michael@0:     "",
michael@0:     "span {",
michael@0:     "  background-color: #EEE; }",
michael@0:     "",
michael@0:     "/*# sourceMappingURL=sourcemaps.css.map */"
michael@0:   ].join("\n"),
michael@0:   "contained.css": [
michael@0:     "#header {",
michael@0:     "  color: #f06; }",
michael@0:     "",
michael@0:     "/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiIiwic291cmNlcyI6WyJzYXNzL2NvbnRhaW5lZC5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUVBO0VBQ0UsT0FISyIsInNvdXJjZXNDb250ZW50IjpbIiRwaW5rOiAjZjA2O1xuXG4jaGVhZGVyIHtcbiAgY29sb3I6ICRwaW5rO1xufSJdfQ==*/"
michael@0:   ].join("\n")
michael@0: }
michael@0: 
michael@0: const cssNames = ["sourcemaps.css", "contained.css"];
michael@0: const scssNames = ["sourcemaps.scss", "contained.scss"];
michael@0: 
michael@0: waitForExplicitFinish();
michael@0: 
michael@0: let test = asyncTest(function*() {
michael@0:   Services.prefs.setBoolPref(PREF, true);
michael@0: 
michael@0:   let {UI} = yield addTabAndOpenStyleEditors(5, null, TESTCASE_URI);
michael@0: 
michael@0:   is(UI.editors.length, 3,
michael@0:     "correct number of editors with source maps enabled");
michael@0: 
michael@0:   // Test first plain css editor
michael@0:   testFirstEditor(UI.editors[0]);
michael@0: 
michael@0:   // Test Scss editors
michael@0:   yield testEditor(UI.editors[1], scssNames);
michael@0:   yield testEditor(UI.editors[2], scssNames);
michael@0: 
michael@0:   // Test disabling original sources
michael@0:   yield togglePref(UI);
michael@0: 
michael@0:   is(UI.editors.length, 3, "correct number of editors after pref toggled");
michael@0: 
michael@0:   // Test CSS editors
michael@0:   yield testEditor(UI.editors[1], cssNames);
michael@0:   yield testEditor(UI.editors[2], cssNames);
michael@0: 
michael@0:   Services.prefs.clearUserPref(PREF);
michael@0: });
michael@0: 
michael@0: function testFirstEditor(editor) {
michael@0:   let name = getStylesheetNameFor(editor);
michael@0:   is(name, "simple.css", "First style sheet display name is correct");
michael@0: }
michael@0: 
michael@0: function testEditor(editor, possibleNames) {
michael@0:   let name = getStylesheetNameFor(editor);
michael@0:   ok(possibleNames.indexOf(name) >= 0, name + " editor name is correct");
michael@0: 
michael@0:   return openEditor(editor).then(() => {
michael@0:     let expectedText = contents[name];
michael@0: 
michael@0:     let text = editor.sourceEditor.getText();
michael@0:     is(text, expectedText, name + " editor contains expected text");
michael@0:   });
michael@0: }
michael@0: 
michael@0: /* Helpers */
michael@0: 
michael@0: function togglePref(UI) {
michael@0:   let deferred = promise.defer();
michael@0:   let count = 0;
michael@0: 
michael@0:   UI.on("editor-added", (event, editor) => {
michael@0:     if (++count == 3) {
michael@0:       deferred.resolve();
michael@0:     }
michael@0:   })
michael@0: 
michael@0:   Services.prefs.setBoolPref(PREF, false);
michael@0:   return deferred.promise;
michael@0: }
michael@0: 
michael@0: function openEditor(editor) {
michael@0:   getLinkFor(editor).click();
michael@0: 
michael@0:   return editor.getSourceEditor();
michael@0: }
michael@0: 
michael@0: function getLinkFor(editor) {
michael@0:   return editor.summary.querySelector(".stylesheet-name");
michael@0: }
michael@0: 
michael@0: function getStylesheetNameFor(editor) {
michael@0:   return editor.summary.querySelector(".stylesheet-name > label")
michael@0:          .getAttribute("value")
michael@0: }