From 1d43cb2cbff33668c117b743837278b484aeb3b8 Mon Sep 17 00:00:00 2001
From: Serhii Kulykov <iamkulykov@gmail.com>
Date: Fri, 25 Mar 2022 10:21:10 +0200
Subject: [PATCH] refactor: enforce hiding dialog host element (#3597)

---
 packages/dialog/src/vaadin-dialog.js |  2 +-
 packages/dialog/test/dialog.test.js  | 13 +++++++++++++
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/packages/dialog/src/vaadin-dialog.js b/packages/dialog/src/vaadin-dialog.js
index f28a8a77bc..b01a5f8445 100644
--- a/packages/dialog/src/vaadin-dialog.js
+++ b/packages/dialog/src/vaadin-dialog.js
@@ -175,7 +175,7 @@ class Dialog extends ThemePropertyMixin(ElementMixin(DialogDraggableMixin(Dialog
     return html`
       <style>
         :host {
-          display: none;
+          display: none !important;
         }
       </style>
 
diff --git a/packages/dialog/test/dialog.test.js b/packages/dialog/test/dialog.test.js
index 3f9a0c8dfd..1a2fa03689 100644
--- a/packages/dialog/test/dialog.test.js
+++ b/packages/dialog/test/dialog.test.js
@@ -45,6 +45,19 @@ describe('vaadin-dialog', () => {
     });
   });
 
+  describe('host element', () => {
+    let dialog;
+
+    beforeEach(() => {
+      dialog = fixtureSync('<vaadin-dialog></vaadin-dialog>');
+    });
+
+    it('should enforce display: none to hide the host element', () => {
+      dialog.style.display = 'block';
+      expect(getComputedStyle(dialog).display).to.equal('none');
+    });
+  });
+
   describe('opened', () => {
     let dialog, backdrop, overlay;