Skip to content
This repository has been archived by the owner on Dec 31, 2021. It is now read-only.

Commit

Permalink
Add tests for win-7 default, light and dark themes
Browse files Browse the repository at this point in the history
  • Loading branch information
@benjaminsattler
benjaminsattler committed May 31, 2020
1 parent a5a2bd0 commit 23f2efd
Show file tree
Hide file tree
Showing 3 changed files with 92 additions and 12 deletions.
7 changes: 3 additions & 4 deletions lib/OsWindow/OsWindow.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -669,7 +669,6 @@ templateElement.innerHTML = `
flex-direction: row-reverse;
background: transparent;
border: 0;
color: var(--win-7-window-theme-dark-font-color);
}
:host([os-theme="win-7"]) .window-title-buttons {
Expand Down Expand Up @@ -825,7 +824,7 @@ templateElement.innerHTML = `
}
:host([os-theme="win-7"]) .window-wrapper,
:host([os-theme="win-7"][theme-"light"]) .window-wrapper {
:host([os-theme="win-7"][theme="light"]) .window-wrapper {
background-color: var(--win-7-window-theme-light-background-color);
}
Expand Down Expand Up @@ -876,11 +875,11 @@ templateElement.innerHTML = `
:host([os-theme="win-7"]) .window-title-button::before,
:host([os-theme="win-7"][theme="light"]) .window-title-button::before {
background: var(--win-7-window-theme-light-title-button-font-border-color);
background-color: var(--win-7-window-theme-light-title-button-font-border-color);
}
:host([os-theme="win-7"][theme="dark"]) .window-title-button::before {
background: var(--win-7-window-theme-dark-title-button-font-border-color);
background-color: var(--win-7-window-theme-dark-title-button-font-border-color);
}
/* }}} */
</style>
Expand Down
86 changes: 78 additions & 8 deletions test/theme.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,9 @@ describe('themes', () => {
let winxp_default;
let winxp_light;
let winxp_dark;
let win7_default;
let win7_light;
let win7_dark;

before((done) => {
frame = quixote.createFrame({
Expand All @@ -78,14 +81,17 @@ describe('themes', () => {

beforeEach(() => {
default_default = frame.get('os-window:not([theme]):not([os-theme])');
default_light = frame.get('os-window[theme=light]:not([os-theme])');
default_dark = frame.get('os-window[theme=dark]:not([os-theme])');
mac_default = frame.get('os-window[os-theme=mac]:not([theme])');
mac_light = frame.get('os-window[os-theme=mac][theme=light]');
mac_dark = frame.get('os-window[os-theme=mac][theme=dark]');
winxp_default = frame.get('os-window[os-theme=win-xp]:not([theme])');
winxp_light = frame.get('os-window[os-theme=win-xp][theme=light]');
winxp_dark = frame.get('os-window[os-theme=win-xp][theme=dark]');
default_light = frame.get('os-window[theme="light"]:not([os-theme])');
default_dark = frame.get('os-window[theme="dark"]:not([os-theme])');
mac_default = frame.get('os-window[os-theme="mac"]:not([theme])');
mac_light = frame.get('os-window[os-theme="mac"][theme="light"]');
mac_dark = frame.get('os-window[os-theme="mac"][theme="dark"]');
winxp_default = frame.get('os-window[os-theme="win-xp"]:not([theme])');
winxp_light = frame.get('os-window[os-theme="win-xp"][theme="light"]');
winxp_dark = frame.get('os-window[os-theme="win-xp"][theme="dark"]');
win7_default = frame.get('os-window[os-theme="win-7"]:not([theme])');
win7_light = frame.get('os-window[os-theme="win-7"][theme="light"]');
win7_dark = frame.get('os-window[os-theme="win-7"][theme="dark"]');
});

describe('default os theme', () => {
Expand Down Expand Up @@ -663,4 +669,68 @@ describe('themes', () => {
});
});
});

describe('win-7 theme', () => {
describe('default theme', () => {
it('matches window-state default theme', () => {
assertWindowStyleEqual(win7_default, win7_light);
});
});

describe('light theme', () => {
describe('host', () => {
it('has the correct border color', () => {
const host = win7_light.toDomElement();
const backgroundColor = window.getComputedStyle(host).getPropertyValue('border-color');
chai.expect(backgroundColor).to.equal('rgb(36, 70, 103)');
});
});

describe('window-wrapper', () => {
it('has the correct background color', () => {
const windowWrapper = win7_light.toDomElement().__shadow.querySelector('.window-wrapper');
const backgroundColor = window.getComputedStyle(windowWrapper).getPropertyValue('background-color');
chai.expect(backgroundColor).to.equal('rgba(161, 187, 215, 0.15)');
});
});

describe('window title button', () => {
it('has the correct font color', () => {
const windowTitleButtons = win7_light.toDomElement().__shadow.querySelectorAll('.window-title-button:not(.window-title-button__close)');
windowTitleButtons.forEach((windowTitleButton) => {
const backgroundColor = window.getComputedStyle(windowTitleButton, 'before').getPropertyValue('background-color');
chai.expect(backgroundColor).to.equal('rgb(93, 97, 113)');
});
});
});
});

describe('dark theme', () => {
describe('host', () => {
it('has the correct border color', () => {
const host = win7_dark.toDomElement();
const backgroundColor = window.getComputedStyle(host).getPropertyValue('border-color');
chai.expect(backgroundColor).to.equal('rgb(82, 82, 82)');
});
});

describe('window-wrapper', () => {
it('has the correct background color', () => {
const windowWrapper = win7_dark.toDomElement().__shadow.querySelector('.window-wrapper');
const backgroundColor = window.getComputedStyle(windowWrapper).getPropertyValue('background-color');
chai.expect(backgroundColor).to.equal('rgba(0, 0, 0, 0.35)');
});
});

describe('window title button', () => {
it('has the correct font color', () => {
const windowTitleButtons = win7_dark.toDomElement().__shadow.querySelectorAll('.window-title-button:not(.window-title-button__close)');
windowTitleButtons.forEach((windowTitleButton) => {
const backgroundColor = window.getComputedStyle(windowTitleButton, 'before').getPropertyValue('background-color');
chai.expect(backgroundColor).to.equal('rgb(93, 97, 113)');
});
});
});
});
});
});
11 changes: 11 additions & 0 deletions test/themes.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,17 @@
os-theme="win-xp"
theme="dark"
></os-window>
<os-window
os-theme="win-7"
></os-window>
<os-window
os-theme="win-7"
theme="light"
></os-window>
<os-window
os-theme="win-7"
theme="dark"
></os-window>
</body>
</html>

Expand Down

0 comments on commit 23f2efd

Please sign in to comment.