test(input): apply modern syntax updates (#27175)

<!-- Please refer to our contributing documentation for any questions on
submitting a pull request, or let us know here if you need any help:
https://ionicframework.com/docs/building/contributing -->

<!-- Some docs updates need to be made in the `ionic-docs` repo, in a
separate PR. See
https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#modifying-documentation
for details. -->

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->

There are tests for `ion-input` that are not in the `/legacy` test
folder, that are using invalid modern syntax.

Inversely, there is legacy tests that do not explicitly set
`legacy="true"` that will be updated the modern syntax when
https://github.com/ionic-team/ionic-framework/pull/27156 is merged.

<!-- Issues are required for both bug fixes and features. -->
Issue URL: N/A


## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- Updates modern tests to use modern label syntax (using `aria-label`)
- Applies `legacy="true"` to legacy test templates
- Fixes a typo in a legacy test where the selector was incorrect

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->

---------

Co-authored-by: ionitron <hi@ionicframework.com>

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

@@ -5,7 +5,7 @@ test.describe('input: basic', () => {
   test.describe('input with overflow', () => {
     test('should not have visual regressions', async ({ page }) => {
       await page.setContent(`
-        <ion-input value="reallylonglonglonginputtoseetheedgesreallylonglonglonginputtoseetheedges"></ion-input>
+        <ion-input aria-label="Long Input" value="reallylonglonglonginputtoseetheedgesreallylonglonglonginputtoseetheedges"></ion-input>
       `);
       const input = page.locator('ion-input');
       // Validates the display of an input where text extends off the edge of the component.
@@ -15,7 +15,7 @@ test.describe('input: basic', () => {
   test.describe('input with placeholder', () => {
     test('should not have visual regressions', async ({ page }) => {
       await page.setContent(`
-        <ion-input placeholder="Placeholder"></ion-input>
+        <ion-input aria-label="Input with Placeholder" placeholder="Placeholder"></ion-input>
       `);
       const input = page.locator('ion-input');
       // Validates the display of an input with a placeholder.

core/src/components/input/test/legacy/a11y/input.e2e.ts

@@ -5,7 +5,7 @@ test.describe('input: a11y', () => {
   test('does not set a default aria-labelledby when there is not a neighboring ion-label', async ({ page, skip }) => {
     skip.rtl();
 
-    await page.setContent('<ion-input></ion-input>');
+    await page.setContent('<ion-input legacy="true"></ion-input>');
 
     const input = page.locator('ion-input > input');
     const ariaLabelledBy = await input.getAttribute('aria-labelledby');

core/src/components/input/test/legacy/basic/input.e2e.ts

@@ -8,7 +8,7 @@ test.describe('input: basic', () => {
         <ion-content>
           <ion-list>
             <ion-item>
-              <ion-input value="reallylonglonglonginputtoseetheedgesreallylonglonglonginputtoseetheedges"></ion-input>
+              <ion-input value="reallylonglonglonginputtoseetheedgesreallylonglonglonginputtoseetheedges" legacy="true"></ion-input>
             </ion-item>
           </ion-list>
         </ion-content>
@@ -25,7 +25,7 @@ test.describe('input: basic', () => {
       <ion-content>
         <ion-list>
           <ion-item>
-            <ion-input placeholder="Placeholder"></ion-input>
+            <ion-input placeholder="Placeholder" legacy="true"></ion-input>
           </ion-item>
         </ion-list>
       </ion-content>
@@ -42,7 +42,7 @@ test.describe('input: basic', () => {
       <ion-content>
         <ion-list>
           <ion-item>
-            <ion-input value="Input disabled" disabled></ion-input>
+            <ion-input value="Input disabled" disabled legacy="true"></ion-input>
           </ion-item>
         </ion-list>
       </ion-content>
@@ -59,7 +59,7 @@ test.describe('input: basic', () => {
       <ion-content>
         <ion-list>
           <ion-item lines="full">
-            <ion-input placeholder="Full"></ion-input>
+            <ion-input placeholder="Full" legacy="true"></ion-input>
           </ion-item>
         </ion-list>
       </ion-content>
@@ -88,7 +88,7 @@ test.describe('input: basic', () => {
       <ion-content>
         <ion-list>
           <ion-item lines="inset">
-            <ion-input placeholder="Inset"></ion-input>
+            <ion-input placeholder="Inset" legacy="true"></ion-input>
           </ion-item>
         </ion-list>
       </ion-content>
@@ -118,7 +118,7 @@ test.describe('input: basic', () => {
       <ion-content>
         <ion-list>
           <ion-item lines="none">
-            <ion-input placeholder="None"></ion-input>
+            <ion-input placeholder="None" legacy="true"></ion-input>
           </ion-item>
         </ion-list>
       </ion-content>
@@ -152,6 +152,7 @@ test.describe('input: basic', () => {
             <ion-input
               clear-input
               value="reallylonglonglonginputtoseetheedgesreallylonglonglonginputtoseetheedges"
+              legacy="true"
             ></ion-input>
           </ion-item>
         </ion-list>
@@ -170,7 +171,7 @@ test.describe('input: clear button', () => {
   });
   test('should clear the input when pressed', async ({ page }) => {
     await page.setContent(`
-      <ion-input value="abc" clear-input="true"></ion-input>
+      <ion-input value="abc" clear-input="true" legacy="true"></ion-input>
     `);
 
     const input = page.locator('ion-input');
@@ -191,7 +192,7 @@ test.describe('input: clear button', () => {
    */
   test('should keep the input focused when the clear button is pressed', async ({ page }) => {
     await page.setContent(`
-      <ion-input value="abc" clear-input="true"></ion-searchbar>
+      <ion-input value="abc" clear-input="true" legacy="true"></ion-input>
     `);
 
     const input = page.locator('ion-input');