fix(item-sliding): use a white item background instead of transparent (…

…#16507)

- use the global item background variable for md
- lowers screenshot threshold to catch this regression

fixes #16474

core/src/components/item/item.md.scss

@@ -7,7 +7,7 @@
 
 :host {
   --min-height: #{$item-md-min-height};
-  --background: var(--ion-item-background, transparent);
+  --background: #{$item-md-background};
   --background-activated: var(--background);
   --border-color: #{$item-md-border-bottom-color};
   --color: #{$item-md-color};

core/src/components/item/test/reorder/index.html

@@ -113,7 +113,7 @@
       for (var i = 0; i < items.length; i++) {
         groupEl.innerHTML += `
           <ion-item onClick="clickedButton(${i})"
-            style="min-height: ${i * 2 + 35}px; background-color: rgb(${255 - i * 4}, ${255 - i * 4}, ${255 - i * 4})">
+            style="min-height: ${i * 2 + 35}px; --background: rgb(${255 - i * 4}, ${255 - i * 4}, ${255 - i * 4})">
             ${i}
             <ion-reorder slot="end"></ion-reorder>
           </ion-item>`;

core/stencil.config.ts

@@ -115,7 +115,7 @@ export const config: Config = {
   ],
   testing: {
     allowableMismatchedPixels: 200,
-    pixelmatchThreshold: 0.1,
+    pixelmatchThreshold: 0.05,
     emulate: [
       {
         userAgent: 'iPhone',