Repository: ionic-team/ionic-framework
File: core/src/components/picker-column-internal/test/disabled/picker-column-internal.e2e.ts (TypeScript)

Code before:
    const pickerItems = page.locator(
      'ion-picker-column-internal .picker-item:not(.picker-item-empty, .picker-item-disabled)'
    );

    expect(await pickerItems.count()).toBe(3);
  });
  test('disabled picker item should not be interactive', async ({ page }) => {
    await page.setContent(`
      <ion-picker-internal>
        <ion-picker-column-internal></ion-picker-column-internal>
      </ion-picker-internal>

      <script>
        const column = document.querySelector('ion-picker-column-internal');
        column.items = [
          { text: 'A', value: 'a' },
          { text: 'B', value: 'b', disabled: true },
          { text: 'C', value: 'c' }
        ]
      </script>
    `);

    const disabledItem = page.locator('ion-picker-column-internal .picker-item.picker-item-disabled');
    expect(disabledItem).not.toBeEnabled();
  });
  test('disabled picker item should be considered active', async ({ page }) => {
    await page.setContent(`
      <ion-picker-internal>
        <ion-picker-column-internal value="b"></ion-picker-column-internal>
      </ion-picker-internal>

      <script>
        const column = document.querySelector('ion-picker-column-internal');
        column.items = [
          { text: 'A', value: 'a' },
          { text: 'B', value: 'b', disabled: true },
          { text: 'C', value: 'c' }
        ]
      </script>
    `);

    const disabledItem = page.locator('ion-picker-column-internal .picker-item[data-value="b"]');
    expect(disabledItem).not.toHaveClass(/picker-item-active/);
  });
  test('setting the value to a disabled item should not cause that item to be active', async ({ page }) => {
    await page.setContent(`
      <ion-picker-internal>
        <ion-picker-column-internal></ion-picker-column-internal>
      </ion-picker-internal>

      <script>

Review comment (suggestion):
```suggestion
  test('disabled picker item should not be considered active', async ({ page }) => {
```

Code after:
    const pickerItems = page.locator(
      'ion-picker-column-internal .picker-item:not(.picker-item-empty, .picker-item-disabled)'
    );

    expect(await pickerItems.count()).toBe(3);
  });
  test('disabled picker item should not be interactive', async ({ page }) => {
    await page.setContent(`
      <ion-picker-internal>
        <ion-picker-column-internal></ion-picker-column-internal>
      </ion-picker-internal>

      <script>
        const column = document.querySelector('ion-picker-column-internal');
        column.items = [
          { text: 'A', value: 'a' },
          { text: 'B', value: 'b', disabled: true },
          { text: 'C', value: 'c' }
        ]
      </script>
    `);

    const disabledItem = page.locator('ion-picker-column-internal .picker-item.picker-item-disabled');
    expect(disabledItem).not.toBeEnabled();
  });
  test('disabled picker item should not be considered active', async ({ page }) => {
    await page.setContent(`
      <ion-picker-internal>
        <ion-picker-column-internal value="b"></ion-picker-column-internal>
      </ion-picker-internal>

      <script>
        const column = document.querySelector('ion-picker-column-internal');
        column.items = [
          { text: 'A', value: 'a' },
          { text: 'B', value: 'b', disabled: true },
          { text: 'C', value: 'c' }
        ]
      </script>
    `);

    const disabledItem = page.locator('ion-picker-column-internal .picker-item[data-value="b"]');
    expect(disabledItem).not.toHaveClass(/picker-item-active/);
  });
  test('setting the value to a disabled item should not cause that item to be active', async ({ page }) => {
    await page.setContent(`
      <ion-picker-internal>
        <ion-picker-column-internal></ion-picker-column-internal>
      </ion-picker-internal>

      <script>