fix(vwc-data-grid): set determined styles (#1070)

* fix(vwc-data-grid): set determined styles * updated snapshots * test failures * nested dom-module * snapshot update * revert * grid determined query * selected state background Co-authored-by: tveinfeld <67224311+tveinfeld@users.noreply.github.com>
Vonage · Oct 4, 2021 · 7339dcf · 7339dcf
1 parent 95f9521
commit 7339dcf
Show file tree

Hide file tree

Showing 10 changed files with 216 additions and 127 deletions.
diff --git a/__snapshots__/data grid data API.md b/__snapshots__/data grid data API.md
@@ -3,6 +3,13 @@
 #### `should have items as data provider`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -75,6 +82,13 @@
 #### `should update items on reassign the whole array`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -147,6 +161,13 @@
 #### `should update items internal change by refreshData`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -217,6 +238,13 @@
 ```
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -298,6 +326,13 @@
 #### `should have dataProvider as data provider`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -370,6 +405,13 @@
 #### `should update dataProvider on reassign it as a new function`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -442,6 +484,13 @@
 #### `should update dataProvider internal change by refreshData`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -512,6 +561,13 @@
 ```
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"

diff --git a/__snapshots__/data grid expand details.md b/__snapshots__/data grid expand details.md
@@ -3,6 +3,13 @@
 #### `should render expanded item when opened`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -84,6 +91,13 @@
 ```
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"

diff --git a/__snapshots__/data grid renderers customization.md b/__snapshots__/data grid renderers customization.md
@@ -3,6 +3,13 @@
 #### `should render header text by default`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -75,6 +82,13 @@
 #### `should render footer text by default`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -151,6 +165,13 @@
 #### `should render custom header when renderer provided`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -223,6 +244,13 @@
 #### `should render custom footer when renderer provided`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -298,6 +326,13 @@
 #### `should render custom cell when renderer provided`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"

diff --git a/__snapshots__/data grid selection UI.md b/__snapshots__/data grid selection UI.md
@@ -3,6 +3,13 @@
 #### `should render selector column with header (multi select)`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -80,6 +87,13 @@
 #### `should not render selector header when single mode`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -155,6 +169,13 @@
 #### `should not render selector header when dataProvider used (even if multi mode)`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -230,6 +251,13 @@
 #### `should hide header when switching from multi to single (items data provider)`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"

diff --git a/__snapshots__/data grid sorting behaviour.md b/__snapshots__/data grid sorting behaviour.md
@@ -3,6 +3,13 @@
 #### `should sort ascending upon the first click on sorting header`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -76,6 +83,13 @@
 ```
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -152,6 +166,13 @@
 #### `should sort descending upon the second click on sorting header`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"
@@ -228,6 +249,13 @@
 #### `should disable sort upon the third click on sorting header`
 
 ```html
+<dom-module
+ id="my-grid-styles"
+ theme-for="vaadin-grid"
+>
+ <template>
+ </template>
+</dom-module>
 <vaadin-grid
  class="vvd-grid-engine-root"
  style="touch-action: none;"