From 576cfae5159f681d6d6a513c1e99719fcbf1c0e4 Mon Sep 17 00:00:00 2001
From: Sergey Vinogradov <mr.vursen@gmail.com>
Date: Wed, 15 Sep 2021 15:11:02 +0300
Subject: [PATCH] fix: update Material visual tests

---
 .../test/visual/material/checkbox.test.js     |  66 +++++++++++-------
 .../checkbox/baseline/rtl-empty.png           | Bin 0 -> 256 bytes
 .../theme/material/vaadin-checkbox-styles.js  |   4 +-
 3 files changed, 44 insertions(+), 26 deletions(-)
 create mode 100644 packages/checkbox/test/visual/material/screenshots/checkbox/baseline/rtl-empty.png

diff --git a/packages/checkbox/test/visual/material/checkbox.test.js b/packages/checkbox/test/visual/material/checkbox.test.js
index cda49ec6a55..5b7e16355fb 100644
--- a/packages/checkbox/test/visual/material/checkbox.test.js
+++ b/packages/checkbox/test/visual/material/checkbox.test.js
@@ -1,5 +1,6 @@
-import { fixtureSync } from '@vaadin/testing-helpers/dist/fixture.js';
+import { sendKeys } from '@web/test-runner-commands';
 import { visualDiff } from '@web/test-runner-visual-regression';
+import { fixtureSync } from '@vaadin/testing-helpers';
 import '../../../theme/material/vaadin-checkbox.js';
 
 describe('checkbox', () => {
@@ -16,14 +17,9 @@ describe('checkbox', () => {
     await visualDiff(div, 'basic');
   });
 
-  it('focus-ring', async () => {
-    element.setAttribute('focus-ring', '');
-    await visualDiff(div, 'focus-ring');
-  });
-
-  it('disabled', async () => {
-    element.disabled = true;
-    await visualDiff(div, 'disabled');
+  it('empty', async () => {
+    element.label = '';
+    await visualDiff(div, 'empty');
   });
 
   it('checked', async () => {
@@ -36,25 +32,47 @@ describe('checkbox', () => {
     await visualDiff(div, 'indeterminate');
   });
 
-  it('disabled checked', async () => {
-    element.disabled = true;
-    element.checked = true;
-    await visualDiff(div, 'disabled-checked');
+  it('focus-ring', async () => {
+    await sendKeys({ press: 'Tab' });
+    await visualDiff(div, 'focus-ring');
   });
 
-  it('disabled indeterminate', async () => {
-    element.disabled = true;
-    element.indeterminate = true;
-    await visualDiff(div, 'disabled-indeterminate');
-  });
+  describe('disabled', () => {
+    beforeEach(() => {
+      element.disabled = true;
+    });
 
-  it('empty', async () => {
-    element.textContent = '';
-    await visualDiff(div, 'empty');
+    it('basic', async () => {
+      await visualDiff(div, 'disabled');
+    });
+
+    it('checked', async () => {
+      element.checked = true;
+      await visualDiff(div, 'disabled-checked');
+    });
+
+    it('indeterminate', async () => {
+      element.indeterminate = true;
+      await visualDiff(div, 'disabled-indeterminate');
+    });
   });
 
-  it('RTL', async () => {
-    document.documentElement.setAttribute('dir', 'rtl');
-    await visualDiff(div, 'rtl');
+  describe('RTL', () => {
+    before(() => {
+      document.documentElement.setAttribute('dir', 'rtl');
+    });
+
+    after(() => {
+      document.documentElement.removeAttribute('dir');
+    });
+
+    it('basic', async () => {
+      await visualDiff(div, 'rtl');
+    });
+
+    it('empty', async () => {
+      element.label = '';
+      await visualDiff(div, 'rtl-empty');
+    });
   });
 });
diff --git a/packages/checkbox/test/visual/material/screenshots/checkbox/baseline/rtl-empty.png b/packages/checkbox/test/visual/material/screenshots/checkbox/baseline/rtl-empty.png
new file mode 100644
index 0000000000000000000000000000000000000000..77e47bfadf255d9f341b82da120229e760dd6628
GIT binary patch
literal 256
zcmeAS@N?(olHy`uVBq!ia0vp^Iv~u!1|;QLq8Nb`V{wqX6T`Z5GB1IgU7jwEArY-_
zZ*1f}q9EXM@#9HehZkZi4lmSfSITIgV3pA*;PqgUcEeORb??uguGX!WiLkpC#jXG8
zXZZm=*3FtTd=KVur3D+zZo29BIw6~PYuJ~2+n??EUNMhdk>zsS=T>jc+Z!1SjybHo
zy6alqLqj$Oh39)rrw19?zBvE-ULvvyKcf#>wp*$PdEMT8y)^RrEq$3}6Wy|N5BKH2
lj*|IR?YS($3`zNI@g;d$jfXbNy$1S%!PC{xWt~$(6982sXbu1X

literal 0
HcmV?d00001

diff --git a/packages/checkbox/theme/material/vaadin-checkbox-styles.js b/packages/checkbox/theme/material/vaadin-checkbox-styles.js
index bf8d8143421..294367c9cfa 100644
--- a/packages/checkbox/theme/material/vaadin-checkbox-styles.js
+++ b/packages/checkbox/theme/material/vaadin-checkbox-styles.js
@@ -14,7 +14,7 @@ registerStyles(
       -webkit-tap-highlight-color: transparent;
     }
 
-    [part='label']:not([empty]) {
+    :host([has-label]) [part='label'] {
       margin: 3px 12px 3px 6px;
     }
 
@@ -126,7 +126,7 @@ registerStyles(
     }
 
     /* RTL specific styles */
-    :host([dir='rtl']) [part='label']:not([empty]) {
+    :host([dir='rtl'][has-label]) [part='label'] {
       margin: 3px 6px 3px 12px;
     }
   `,