test(): remove initial waitFor (#19217)

core/src/components/card-header/test/basic/e2e.ts

@@ -5,8 +5,6 @@ test('card-header: basic', async () => {
     url: '/src/components/card-header/test/basic?ionic:_testing=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });

core/src/components/img/test/basic/e2e.ts

@@ -5,8 +5,6 @@ test('img: basic', async () => {
     url: '/src/components/img/test/basic?ionic:_testing=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });

core/src/components/img/test/standalone/e2e.ts

@@ -5,8 +5,6 @@ test('img: standalone', async () => {
     url: '/src/components/img/test/standalone?ionic:_testing=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });

core/src/components/radio-group/test/standalone/e2e.ts

@@ -5,8 +5,6 @@ test('radio-group: standalone', async () => {
     url: '/src/components/radio-group/test/standalone?ionic:_testing=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });

core/src/components/range/range.tsx

@@ -169,21 +169,10 @@ export class Range implements ComponentInterface {
    */
   @Event() ionBlur!: EventEmitter<void>;
 
-  async connectedCallback() {
+  connectedCallback() {
     this.updateRatio();
     this.debounceChanged();
-    this.emitStyle();
+    this.disabledChanged();
-
-    this.gesture = (await import('../../utils/gesture')).createGesture({
-      el: this.rangeSlider!,
-      gestureName: 'range',
-      gesturePriority: 100,
-      threshold: 0,
-      onStart: ev => this.onStart(ev),
-      onMove: ev => this.onMove(ev),
-      onEnd: ev => this.onEnd(ev),
-    });
-    this.gesture.setDisabled(this.disabled);
   }
 
   disconnectedCallback() {
@@ -193,6 +182,22 @@ export class Range implements ComponentInterface {
     }
   }
 
+  async componentDidLoad() {
+    const rangeSlider = this.rangeSlider;
+    if (rangeSlider) {
+      this.gesture = (await import('../../utils/gesture')).createGesture({
+        el: rangeSlider,
+        gestureName: 'range',
+        gesturePriority: 100,
+        threshold: 0,
+        onStart: ev => this.onStart(ev),
+        onMove: ev => this.onMove(ev),
+        onEnd: ev => this.onEnd(ev),
+      });
+      this.gesture.setDisabled(this.disabled);
+    }
+  }
+
   private handleKeyboard = (knob: KnobName, isIncrease: boolean) => {
     let step = this.step;
     step = step > 0 ? step : 1;

core/src/components/reorder-group/reorder-group.tsx

@@ -54,11 +54,9 @@ export class ReorderGroup implements ComponentInterface {
 
   async connectedCallback() {
     const contentEl = this.el.closest('ion-content');
-    if (!contentEl) {
+    if (contentEl) {
-      console.error('<ion-reorder-group> must be used inside an <ion-content>');
+      this.scrollEl = await contentEl.getScrollElement();
-      return;
     }
-    this.scrollEl = await contentEl.getScrollElement();
     this.gesture = (await import('../../utils/gesture')).createGesture({
       el: this.el,
       gestureName: 'reorder',
@@ -201,10 +199,7 @@ export class ReorderGroup implements ComponentInterface {
     const fromIndex = indexForItem(selectedItemEl);
 
     if (toIndex === fromIndex) {
-      selectedItemEl.style.transition = 'transform 200ms ease-in-out';
+      this.completeSync();
-      selectedItemEl.style.transform = '';
-      selectedItemEl.classList.remove(ITEM_REORDER_SELECTED);
-      setTimeout(() => this.completeSync(), 200);
     } else {
       this.ionItemReorder.emit({
         from: fromIndex,

core/src/components/searchbar/test/basic/e2e.ts

@@ -5,8 +5,6 @@ test('searchbar: basic', async () => {
     url: '/src/components/searchbar/test/basic?ionic:_testing=true'
   });
 
-  await page.waitFor(250);
-
   const compares = [];
   compares.push(await page.compareScreenshot());
 
@@ -39,8 +37,6 @@ test('searchbar:rtl: basic', async () => {
     url: '/src/components/searchbar/test/basic?ionic:_testing=true&rtl=true'
   });
 
-  await page.waitFor(250);
-
   const compares = [];
   compares.push(await page.compareScreenshot());
 

core/src/components/searchbar/test/standalone/e2e.ts

@@ -5,8 +5,6 @@ test('searchbar: standalone', async () => {
     url: '/src/components/searchbar/test/standalone?ionic:_testing=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 

core/src/components/searchbar/test/toolbar/e2e.ts

@@ -5,8 +5,6 @@ test('searchbar: toolbar', async () => {
     url: '/src/components/searchbar/test/toolbar?ionic:_testing=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });

core/src/components/segment/test/basic/e2e.ts

@@ -5,8 +5,6 @@ test('segment: basic', async () => {
     url: '/src/components/segment/test/basic?ionic:_testing=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });
@@ -16,8 +14,6 @@ test('segment:rtl: basic', async () => {
     url: '/src/components/segment/test/basic?ionic:_testing=true&rtl=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });

core/src/components/segment/test/custom/e2e.ts

@@ -5,8 +5,6 @@ test('segment: custom', async () => {
     url: '/src/components/segment/test/custom?ionic:_testing=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });

core/src/components/segment/test/modes/e2e.ts

@@ -5,8 +5,6 @@ test('segment: modes', async () => {
     url: '/src/components/segment/test/modes?ionic:_testing=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });

core/src/components/segment/test/spec/e2e.ts

@@ -5,8 +5,6 @@ test('segment: spec', async () => {
     url: '/src/components/segment/test/spec?ionic:_testing=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });
@@ -16,8 +14,6 @@ test('segment:rtl: spec', async () => {
     url: '/src/components/segment/test/spec?ionic:_testing=true&rtl=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });

core/src/components/segment/test/standalone/e2e.ts

@@ -5,8 +5,6 @@ test('segment: standalone', async () => {
     url: '/src/components/segment/test/standalone?ionic:_testing=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });

core/src/components/slides/test/basic/e2e.ts

@@ -5,8 +5,6 @@ test('slides: basic', async () => {
     url: '/src/components/slides/test/basic?ionic:_testing=true'
   });
 
-  await page.waitFor(500);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });

core/src/components/slides/test/image/e2e.ts

@@ -5,8 +5,6 @@ test('slides: image', async () => {
     url: '/src/components/slides/test/image?ionic:_testing=true'
   });
 
-  await page.waitFor(500);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });

core/src/components/slides/test/standalone/e2e.ts

@@ -5,8 +5,6 @@ test('slides: standalone', async () => {
     url: '/src/components/slides/test/standalone?ionic:_testing=true'
   });
 
-  await page.waitFor(500);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });

core/src/components/textarea/test/basic/e2e.ts

@@ -9,7 +9,7 @@ test('textarea: basic', async () => {
 
   compares.push(await page.compareScreenshot());
 
-  page.waitFor(2000);
+  await page.waitFor(250);
   compares.push(await page.compareScreenshot('value changed'));
 
   for (const compare of compares) {

core/src/components/toggle/test/basic/e2e.ts

@@ -5,8 +5,6 @@ test('toggle: basic', async () => {
     url: '/src/components/toggle/test/basic?ionic:_testing=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });
@@ -16,8 +14,6 @@ test('toggle:rtl: basic', async () => {
     url: '/src/components/toggle/test/basic?ionic:_testing=true&rtl=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });

core/src/themes/test/css-variables/e2e.ts

@@ -5,8 +5,6 @@ test('themes: css-variables', async () => {
     url: '/src/themes/test/css-variables?ionic:_testing=true'
   });
 
-  await page.waitFor(250);
-
   const compare = await page.compareScreenshot();
   expect(compare).toMatchScreenshot();
 });