From 5c248180941d3b6aec03c704852e7190e7cbead8 Mon Sep 17 00:00:00 2001 From: Luan Raithz Machado Date: Wed, 29 Jul 2020 16:10:23 -0300 Subject: [PATCH 1/9] Changed toHaveStyle to use getPropertyValue instead of accessing the property directly --- src/__tests__/to-have-style.js | 48 ++++++++++++++++++++++++++++++++++ src/to-have-style.js | 2 +- 2 files changed, 49 insertions(+), 1 deletion(-) diff --git a/src/__tests__/to-have-style.js b/src/__tests__/to-have-style.js index 6a636f95..fd3f9236 100644 --- a/src/__tests__/to-have-style.js +++ b/src/__tests__/to-have-style.js @@ -103,6 +103,9 @@ describe('.toHaveStyle', () => { expect(container.querySelector('.label')).toHaveStyle('color white'), ).toThrowError() + expect(() => + expect(container.querySelector('.label')).toHaveStyle('--color: black'), + ).toThrowError() document.body.removeChild(style) document.body.removeChild(container) }) @@ -116,6 +119,33 @@ describe('.toHaveStyle', () => { ) }) + test('handles inline customer properties', () => { + const {queryByTestId} = render(` + Hello World + `) + expect(queryByTestId('color-example')).toHaveStyle('--color: blue') + }) + + test('handles global customer properties', () => { + const style = document.createElement('style') + style.innerHTML = ` + div { + --color: blue; + } + ` + + const {container} = render(` +
+ Hello world +
+ `) + + document.body.appendChild(style) + document.body.appendChild(container) + + expect(container).toHaveStyle(`--color: blue`) + }) + test('properly normalizes colors for border', () => { const {queryByTestId} = render(` Hello World @@ -170,6 +200,24 @@ describe('.toHaveStyle', () => { }) }) + test("doesn't consider the unit if it isn't explicitly set ", () => { + const {queryByTestId} = render(` + Hello World + `) + expect(queryByTestId('color-example')).toHaveStyle({ + fontSize: 12 + }) + }) + + test("Fails with an invalid unit", () => { + const {queryByTestId} = render(` + Hello World + `) + expect(() => { + expect(queryByTestId('color-example')).toHaveStyle({ fontSize: '12px' }) + }).toThrowError() + }) + test('supports dash-cased property names', () => { const {container} = render(`
diff --git a/src/to-have-style.js b/src/to-have-style.js index a404c40a..7926827b 100644 --- a/src/to-have-style.js +++ b/src/to-have-style.js @@ -22,7 +22,7 @@ function isSubset(styles, computedStyle) { Object.entries(styles).every( ([prop, value]) => computedStyle[prop] === value || - computedStyle[prop.toLowerCase()] === value, + computedStyle.getPropertyValue(prop.toLowerCase()) === value, ) ) } From 396681928876871a318b14f3ffabe52541fe4822 Mon Sep 17 00:00:00 2001 From: Luan Raithz Machado Date: Wed, 29 Jul 2020 16:46:22 -0300 Subject: [PATCH 2/9] Using px instead of rem --- src/__tests__/to-have-style.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/__tests__/to-have-style.js b/src/__tests__/to-have-style.js index fd3f9236..b4b105bd 100644 --- a/src/__tests__/to-have-style.js +++ b/src/__tests__/to-have-style.js @@ -202,7 +202,7 @@ describe('.toHaveStyle', () => { test("doesn't consider the unit if it isn't explicitly set ", () => { const {queryByTestId} = render(` - Hello World + Hello World `) expect(queryByTestId('color-example')).toHaveStyle({ fontSize: 12 From 48ae84d25887a7cb6bbf8d47ed77480a8e511b49 Mon Sep 17 00:00:00 2001 From: Luan Raithz Machado Date: Wed, 29 Jul 2020 17:47:19 -0300 Subject: [PATCH 3/9] changed test description --- src/__tests__/to-have-style.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/__tests__/to-have-style.js b/src/__tests__/to-have-style.js index b4b105bd..eaff4f45 100644 --- a/src/__tests__/to-have-style.js +++ b/src/__tests__/to-have-style.js @@ -200,7 +200,7 @@ describe('.toHaveStyle', () => { }) }) - test("doesn't consider the unit if it isn't explicitly set ", () => { + test("Uses px as the default unit", () => { const {queryByTestId} = render(` Hello World `) From 1c584c1e298692d3b4696a408061d6df9be06e2e Mon Sep 17 00:00:00 2001 From: Luan Raithz Machado Date: Fri, 31 Jul 2020 10:18:56 -0300 Subject: [PATCH 4/9] Update src/__tests__/to-have-style.js MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Ernesto García --- src/__tests__/to-have-style.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/__tests__/to-have-style.js b/src/__tests__/to-have-style.js index eaff4f45..1dbf5dc6 100644 --- a/src/__tests__/to-have-style.js +++ b/src/__tests__/to-have-style.js @@ -119,7 +119,7 @@ describe('.toHaveStyle', () => { ) }) - test('handles inline customer properties', () => { + test('handles inline custom properties', () => { const {queryByTestId} = render(` Hello World `) From f2cb1e9431f7fd7783d8af689ed7149e88cca995 Mon Sep 17 00:00:00 2001 From: Luan Raithz Machado Date: Fri, 31 Jul 2020 10:19:09 -0300 Subject: [PATCH 5/9] Update src/__tests__/to-have-style.js MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Ernesto García --- src/__tests__/to-have-style.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/__tests__/to-have-style.js b/src/__tests__/to-have-style.js index 1dbf5dc6..0f134660 100644 --- a/src/__tests__/to-have-style.js +++ b/src/__tests__/to-have-style.js @@ -126,7 +126,7 @@ describe('.toHaveStyle', () => { expect(queryByTestId('color-example')).toHaveStyle('--color: blue') }) - test('handles global customer properties', () => { + test('handles global custom properties', () => { const style = document.createElement('style') style.innerHTML = ` div { From c13abf5260db83745a966173a89f2adfee929ace Mon Sep 17 00:00:00 2001 From: Luan Raithz Machado Date: Fri, 31 Jul 2020 10:19:21 -0300 Subject: [PATCH 6/9] Update src/__tests__/to-have-style.js MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Ernesto García --- src/__tests__/to-have-style.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/__tests__/to-have-style.js b/src/__tests__/to-have-style.js index 0f134660..06cf8484 100644 --- a/src/__tests__/to-have-style.js +++ b/src/__tests__/to-have-style.js @@ -211,8 +211,8 @@ describe('.toHaveStyle', () => { test("Fails with an invalid unit", () => { const {queryByTestId} = render(` - Hello World - `) + Hello World + `) expect(() => { expect(queryByTestId('color-example')).toHaveStyle({ fontSize: '12px' }) }).toThrowError() From d5afec412524a76cdb57e034c51fb27ef2dadf4d Mon Sep 17 00:00:00 2001 From: Luan Raithz Machado Date: Fri, 31 Jul 2020 10:19:28 -0300 Subject: [PATCH 7/9] Update src/__tests__/to-have-style.js MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Ernesto García --- src/__tests__/to-have-style.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/__tests__/to-have-style.js b/src/__tests__/to-have-style.js index 06cf8484..6f39269f 100644 --- a/src/__tests__/to-have-style.js +++ b/src/__tests__/to-have-style.js @@ -121,8 +121,8 @@ describe('.toHaveStyle', () => { test('handles inline custom properties', () => { const {queryByTestId} = render(` - Hello World - `) + Hello World + `) expect(queryByTestId('color-example')).toHaveStyle('--color: blue') }) From e54eff93635e7a7a5ce4adb5d8cd100ecdc9f1fa Mon Sep 17 00:00:00 2001 From: Luan Raithz Machado Date: Fri, 31 Jul 2020 10:19:58 -0300 Subject: [PATCH 8/9] Update src/__tests__/to-have-style.js MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: Ernesto García --- src/__tests__/to-have-style.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/__tests__/to-have-style.js b/src/__tests__/to-have-style.js index 6f39269f..bbae2e45 100644 --- a/src/__tests__/to-have-style.js +++ b/src/__tests__/to-have-style.js @@ -202,8 +202,8 @@ describe('.toHaveStyle', () => { test("Uses px as the default unit", () => { const {queryByTestId} = render(` - Hello World - `) + Hello World + `) expect(queryByTestId('color-example')).toHaveStyle({ fontSize: 12 }) From 0d869d8d954355933ef1a4431db1ede80b9575c2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ernesto=20Garc=C3=ADa?= Date: Tue, 11 Aug 2020 09:49:09 -0400 Subject: [PATCH 9/9] Apply suggestions from code review --- src/__tests__/to-have-style.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/__tests__/to-have-style.js b/src/__tests__/to-have-style.js index bbae2e45..0d94efaa 100644 --- a/src/__tests__/to-have-style.js +++ b/src/__tests__/to-have-style.js @@ -200,7 +200,7 @@ describe('.toHaveStyle', () => { }) }) - test("Uses px as the default unit", () => { + test('Uses px as the default unit', () => { const {queryByTestId} = render(` Hello World `) @@ -209,7 +209,7 @@ describe('.toHaveStyle', () => { }) }) - test("Fails with an invalid unit", () => { + test('Fails with an invalid unit', () => { const {queryByTestId} = render(` Hello World `)