mozilla
/
gecko-dev
зеркало из https://github.com/mozilla/gecko-dev.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

Backed out changeset 91a30d78c074 (bug 1347207) for browser_ext_themes_experiment.js test failures

This commit is contained in:
Andreea Pavel 2018-08-09 14:46:38 +03:00
Родитель 1784c2f3a0
Коммит c7eba1716b
5 изменённых файлов: 23 добавлений и 380 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

48
toolkit/components/extensions/parent/ext-theme.js
Просмотреть файл

@ -1,6 +1,6 @@
"use strict";
/* global windowTracker, EventManager, EventEmitter, AddonManager */
/* global windowTracker, EventManager, EventEmitter */
ChromeUtils.import("resource://gre/modules/Services.jsm");
@ -36,7 +36,7 @@ class Theme {
* @param {string} extension Extension that created the theme.
* @param {Integer} windowId The windowId where the theme is applied.
*/
constructor({extension, details, windowId, experiment}) {
constructor({extension, details, windowId}) {
this.extension = extension;
this.details = details;
this.windowId = windowId;
@ -45,24 +45,6 @@ class Theme {
icons: {},
};
if (experiment) {
const canRunExperiment = !AppConstants.MOZ_ALLOW_LEGACY_EXTENSIONS &&
Services.prefs.getBoolPref("extensions.legacy.enabled");
if (canRunExperiment) {
this.lwtStyles.experimental = {
colors: {},
images: {},
properties: {},
};
const {baseURI} = this.extension;
if (experiment.stylesheet) {
experiment.stylesheet = baseURI.resolve(experiment.stylesheet);
}
this.experiment = experiment;
} else {
throw new Error("This extension is not allowed to run theme experiments");
}
}
this.load();
}
@ -106,9 +88,6 @@ class Theme {
}
onUpdatedEmitter.emit("theme-updated", this.details, this.windowId);
if (this.experiment) {
lwtData.experiment = this.experiment;
}
LightweightThemeManager.fallbackThemeData = this.lwtStyles;
Services.obs.notifyObservers(null,
"lightweight-theme-styling-update",
@ -184,13 +163,7 @@ class Theme {
case "ntp_text":
this.lwtStyles[color] = cssColor;
break;
default:
if (this.experiment && this.experiment.colors && color in this.experiment.colors) {
this.lwtStyles.experimental.colors[color] = cssColor;
}
break;
}
}
}
@ -221,12 +194,6 @@ class Theme {
this.lwtStyles.headerURL = resolvedURL;
break;
}
default: {
if (this.experiment && this.experiment.images && image in this.experiment.images) {
this.lwtStyles.experimental.images[image] = baseURI.resolve(val);
}
break;
}
}
}
}
@ -318,12 +285,6 @@ class Theme {
this.lwtStyles.backgroundsTiling = tiling.join(",");
break;
}
default: {
if (this.experiment && this.experiment.properties && property in this.experiment.properties) {
this.lwtStyles.experimental.properties[property] = val;
}
break;
}
}
}
}
@ -353,12 +314,10 @@ this.theme = class extends ExtensionAPI {
onManifestEntry(entryName) {
let {extension} = this;
let {manifest} = extension;
let {theme, theme_experiment} = manifest;
defaultTheme = new Theme({
extension,
details: theme,
experiment: theme_experiment,
details: manifest.theme,
});
}
@ -407,7 +366,6 @@ this.theme = class extends ExtensionAPI {
extension,
details,
windowId,
experiment: this.extension.manifest.theme_experiment,
});
},
reset: (windowId) => {

46
toolkit/components/extensions/schemas/theme.json
Просмотреть файл

@ -41,37 +41,6 @@
}
]
},
{
"id": "ThemeExperiment",
"type": "object",
"properties": {
"stylesheet": {
"optional": true,
"$ref": "ExtensionURL"
},
"images": {
"type": "object",
"optional": true,
"additionalProperties": {
"type": "string"
}
},
"colors": {
"type": "object",
"optional": true,
"additionalProperties": {
"type": "string"
}
},
"properties": {
"type": "object",
"optional": true,
"additionalProperties": {
"type": "string"
}
}
}
},
{
"id": "ThemeType",
"type": "object",
@ -611,11 +580,7 @@
},
"default_locale": {
"type": "string",
"optional": true
},
"theme_experiment": {
"$ref": "ThemeExperiment",
"optional": true
"optional": "true"
},
"icons": {
"type": "object",
@ -625,15 +590,6 @@
}
}
}
},
{
"$extend": "WebExtensionManifest",
"properties": {
"theme_experiment": {
"$ref": "ThemeExperiment",
"optional": true
}
}
}
]
},

1
toolkit/components/extensions/test/browser/browser.ini
Просмотреть файл

@ -9,7 +9,6 @@ skip-if = verify
[browser_ext_themes_dynamic_getCurrent.js]
[browser_ext_themes_dynamic_onUpdated.js]
[browser_ext_themes_dynamic_updates.js]
[browser_ext_themes_experiment.js]
[browser_ext_themes_getCurrent_differentExt.js]
[browser_ext_themes_lwtsupport.js]
[browser_ext_themes_multiple_backgrounds.js]

217
toolkit/components/extensions/test/browser/browser_ext_themes_experiment.js
Просмотреть файл

@ -1,217 +0,0 @@
"use strict";
// This test checks whether the theme experiments work
add_task(async function test_experiment_static_theme() {
let extension = ExtensionTestUtils.loadExtension({
manifest: {
theme: {
colors: {
some_color_property: "#ff00ff",
},
images: {
some_image_property: "background.jpg",
},
properties: {
some_random_property: "no-repeat",
}
},
theme_experiment: {
colors: {
some_color_property: "--some-color-property",
},
images: {
some_image_property: "--some-image-property",
},
properties: {
some_random_property: "--some-random-property",
}
}
},
});
const root = window.document.documentElement;
is(root.style.getPropertyValue("--some-color-property"), "",
"Color property should be unset");
is(root.style.getPropertyValue("--some-image-property"), "",
"Image property should be unset");
is(root.style.getPropertyValue("--some-random-property"), "",
"Generic Property should be unset.");
await extension.startup();
is(root.style.getPropertyValue("--some-color-property"), hexToCSS("#ff00ff"),
"Color property should be parsed and set.");
ok(root.style.getPropertyValue("--some-image-property").startsWith("url("),
"Image property should be parsed.");
ok(root.style.getPropertyValue("--some-image-property").endsWith("background.jpg)"),
"Image property should be set.");
is(root.style.getPropertyValue("--some-random-property"), "no-repeat",
"Generic Property should be set.");
await extension.unload();
is(root.style.getPropertyValue("--some-color-property"), "",
"Color property should be unset");
is(root.style.getPropertyValue("--some-image-property"), "",
"Image property should be unset");
is(root.style.getPropertyValue("--some-random-property"), "",
"Generic Property should be unset.");
});
add_task(async function test_experiment_dynamic_theme() {
let extension = ExtensionTestUtils.loadExtension({
manifest: {
permissions: ["theme"],
theme_experiment: {
colors: {
some_color_property: "--some-color-property",
},
images: {
some_image_property: "--some-image-property",
},
properties: {
some_random_property: "--some-random-property",
}
}
},
background() {
const theme = {
colors: {
some_color_property: "#ff00ff",
},
images: {
some_image_property: "background.jpg",
},
properties: {
some_random_property: "no-repeat",
}
};
browser.test.onMessage.addListener((msg) => {
if (msg === "update-theme") {
browser.theme.update(theme).then(() => {
browser.test.sendMessage("theme-updated");
});
} else {
browser.theme.reset().then(() => {
browser.test.sendMessage("theme-reset");
});
}
});
},
});
await extension.startup();
const root = window.document.documentElement;
is(root.style.getPropertyValue("--some-color-property"), "",
"Color property should be unset");
is(root.style.getPropertyValue("--some-image-property"), "",
"Image property should be unset");
is(root.style.getPropertyValue("--some-random-property"), "",
"Generic Property should be unset.");
extension.sendMessage("update-theme");
await extension.awaitMessage("theme-updated");
is(root.style.getPropertyValue("--some-color-property"), hexToCSS("#ff00ff"),
"Color property should be parsed and set.");
ok(root.style.getPropertyValue("--some-image-property").startsWith("url("),
"Image property should be parsed.");
ok(root.style.getPropertyValue("--some-image-property").endsWith("background.jpg)"),
"Image property should be set.");
is(root.style.getPropertyValue("--some-random-property"), "no-repeat",
"Generic Property should be set.");
extension.sendMessage("reset-theme");
await extension.awaitMessage("theme-reset");
is(root.style.getPropertyValue("--some-color-property"), "",
"Color property should be unset");
is(root.style.getPropertyValue("--some-image-property"), "",
"Image property should be unset");
is(root.style.getPropertyValue("--some-random-property"), "",
"Generic Property should be unset.");
extension.sendMessage("update-theme");
await extension.awaitMessage("theme-updated");
is(root.style.getPropertyValue("--some-color-property"), hexToCSS("#ff00ff"),
"Color property should be parsed and set.");
ok(root.style.getPropertyValue("--some-image-property").startsWith("url("),
"Image property should be parsed.");
ok(root.style.getPropertyValue("--some-image-property").endsWith("background.jpg)"),
"Image property should be set.");
is(root.style.getPropertyValue("--some-random-property"), "no-repeat",
"Generic Property should be set.");
await extension.unload();
is(root.style.getPropertyValue("--some-color-property"), "",
"Color property should be unset");
is(root.style.getPropertyValue("--some-image-property"), "",
"Image property should be unset");
is(root.style.getPropertyValue("--some-random-property"), "",
"Generic Property should be unset.");
});
add_task(async function test_experiment_stylesheet() {
let extension = ExtensionTestUtils.loadExtension({
manifest: {
theme: {
colors: {
menu_button_background: "#ff00ff",
},
},
theme_experiment: {
stylesheet: "experiment.css",
colors: {
menu_button_background: "--menu-button-background",
},
},
},
files: {
"experiment.css": `#PanelUI-menu-button {
background-color: var(--menu-button-background);
fill: white;
}`,
}
});
const root = window.document.documentElement;
const menuButton = document.getElementById("PanelUI-menu-button");
const computedStyle = window.getComputedStyle(menuButton);
const expectedColor = hexToCSS("#ff00ff");
const expectedFill = hexToCSS("#ffffff");
is(root.style.getPropertyValue("--menu-button-background"), "",
"Variable should be unset");
isnot(computedStyle.backgroundColor, expectedColor,
"Menu button should not have custom background");
isnot(computedStyle.fill, expectedFill,
"Menu button should not have stylesheet fill");
await extension.startup();
// Wait for stylesheet load.
await BrowserTestUtils.waitForCondition(() => computedStyle.fill === expectedFill);
is(root.style.getPropertyValue("--menu-button-background"), expectedColor,
"Variable should be parsed and set.");
is(computedStyle.backgroundColor, expectedColor,
"Menu button should be have correct background");
is(computedStyle.fill, expectedFill,
"Menu button should be have correct fill");
await extension.unload();
is(root.style.getPropertyValue("--menu-button-background"), "",
"Variable should be unset");
isnot(computedStyle.backgroundColor, expectedColor,
"Menu button should not have custom background");
isnot(computedStyle.fill, expectedFill,
"Menu button should not have stylesheet fill");
});

91
toolkit/modules/LightweightThemeConsumer.jsm
Просмотреть файл

@ -137,14 +137,14 @@ LightweightThemeConsumer.prototype = {
let parsedData = JSON.parse(aData);
if (!parsedData) {
parsedData = { theme: null, experiment: null };
parsedData = { theme: null };
}
if (parsedData.window && parsedData.window !== this._winId) {
return;
}
this._update(parsedData.theme, parsedData.experiment);
this._update(parsedData.theme);
},
handleEvent(aEvent) {
@ -163,43 +163,42 @@ LightweightThemeConsumer.prototype = {
}
},
_update(theme, experiment) {
this._lastData = theme;
if (theme) {
theme = LightweightThemeImageOptimizer.optimize(theme, this._win.screen);
_update(aData) {
this._lastData = aData;
if (aData) {
aData = LightweightThemeImageOptimizer.optimize(aData, this._win.screen);
}
let active = this._active = theme && theme.id !== DEFAULT_THEME_ID;
let active = this._active = aData && aData.id !== DEFAULT_THEME_ID;
if (!theme) {
theme = {};
if (!aData) {
aData = {};
}
let root = this._doc.documentElement;
if (active && theme.headerURL) {
if (active && aData.headerURL) {
root.setAttribute("lwtheme-image", "true");
} else {
root.removeAttribute("lwtheme-image");
}
if (active && theme.icons) {
let activeIcons = Object.keys(theme.icons).join(" ");
if (active && aData.icons) {
let activeIcons = Object.keys(aData.icons).join(" ");
root.setAttribute("lwthemeicons", activeIcons);
} else {
root.removeAttribute("lwthemeicons");
}
for (let icon of ICONS) {
let value = theme.icons ? theme.icons[`--${icon}-icon`] : null;
let value = aData.icons ? aData.icons[`--${icon}-icon`] : null;
_setImage(root, active, `--${icon}-icon`, value);
}
this._setExperiment(active, experiment, theme.experimental);
_setImage(root, active, "--lwt-header-image", theme.headerURL);
_setImage(root, active, "--lwt-footer-image", theme.footerURL);
_setImage(root, active, "--lwt-additional-images", theme.additionalBackgrounds);
_setProperties(root, active, theme);
_setImage(root, active, "--lwt-header-image", aData.headerURL);
_setImage(root, active, "--lwt-footer-image", aData.footerURL);
_setImage(root, active, "--lwt-additional-images", aData.additionalBackgrounds);
_setProperties(root, active, aData);
if (active) {
root.setAttribute("lwtheme", "true");
@ -208,65 +207,13 @@ LightweightThemeConsumer.prototype = {
root.removeAttribute("lwthemetextcolor");
}
if (active && theme.footerURL)
if (active && aData.footerURL)
root.setAttribute("lwthemefooter", "true");
else
root.removeAttribute("lwthemefooter");
let contentThemeData = _getContentProperties(this._doc, active, theme);
let contentThemeData = _getContentProperties(this._doc, active, aData);
Services.ppmm.sharedData.set(`theme/${this._winId}`, contentThemeData);
},
_setExperiment(active, experiment, properties) {
const root = this._doc.documentElement;
if (this._lastExperimentData) {
const { stylesheet, usedVariables } = this._lastExperimentData;
if (stylesheet) {
stylesheet.remove();
}
if (usedVariables) {
for (const variable of usedVariables) {
_setProperty(root, false, variable);
}
}
}
if (active && experiment) {
this._lastExperimentData = {};
if (experiment.stylesheet) {
/* Stylesheet URLs are validated using WebExtension schemas */
let stylesheetAttr = `href="${experiment.stylesheet}" type="text/css"`;
let stylesheet = this._doc.createProcessingInstruction("xml-stylesheet",
stylesheetAttr);
this._doc.insertBefore(stylesheet, root);
this._lastExperimentData.stylesheet = stylesheet;
}
let usedVariables = [];
if (properties.colors) {
for (const property in properties.colors) {
const cssVariable = experiment.colors[property];
const value = _sanitizeCSSColor(root.ownerDocument, properties.colors[property]);
_setProperty(root, active, cssVariable, value);
usedVariables.push(cssVariable);
}
}
if (properties.images) {
for (const property in properties.images) {
const cssVariable = experiment.images[property];
_setProperty(root, active, cssVariable, `url(${properties.images[property]})`);
usedVariables.push(cssVariable);
}
}
if (properties.properties) {
for (const property in properties.properties) {
const cssVariable = experiment.properties[property];
_setProperty(root, active, cssVariable, properties.properties[property]);
usedVariables.push(cssVariable);
}
}
this._lastExperimentData.usedVariables = usedVariables;
} else {
this._lastExperimentData = null;
}
}
};