test(toggle): add e2e test and screenshots for end placement

Author: brandyscarney

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

@@ -53,7 +53,7 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
 
 configs({ directions: ['ltr'], modes: ['md'] }).forEach(({ title, screenshot, config }) => {
   test.describe(title('toggle: long label in item'), () => {
-    test('should render margins correctly when using long label in item', async ({ page }) => {
+    test('should not have visual regressions when using long label in item', async ({ page }) => {
       await page.setContent(
         `
           <ion-list>
@@ -71,8 +71,27 @@ configs({ directions: ['ltr'], modes: ['md'] }).forEach(({ title, screenshot, co
     });
   });
 
+  test.describe(title('toggle: end label in item'), () => {
+    test('should not have visual regressions when using end label in item', async ({ page }) => {
+      await page.setContent(
+        `
+          <ion-list>
+            <ion-radio-group>
+              <ion-item>
+                <ion-toggle label-placement="end">Enable Notifications</ion-toggle>
+              </ion-item>
+            </ion-radio-group>
+          </ion-list>
+        `,
+        config
+      );
+      const list = page.locator('ion-list');
+      await expect(list).toHaveScreenshot(screenshot(`toggle-end-label-in-item`));
+    });
+  });
+
   test.describe(title('toggle: stacked label in item'), () => {
-    test('should render margins correctly when using stacked label in item', async ({ page }) => {
+    test('should not have visual regressions when using stacked label in item', async ({ page }) => {
       await page.setContent(
         `
           <ion-list>