fix(select): prevent floating label and placeholder from overlapping when focused

core/src/components/select/select.tsx

@@ -1228,7 +1228,8 @@ export class Select implements ComponentInterface {
      * TODO(FW-5592): Remove hasStartEndSlots condition
      */
     const labelShouldFloat =
-      labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || isExpanded || hasStartEndSlots));
+      labelPlacement === 'stacked' ||
+      (labelPlacement === 'floating' && (hasValue || hasFocus || isExpanded || hasStartEndSlots));
 
     return (
       <Host

core/src/components/select/test/label/select.e2e.ts

@@ -195,6 +195,22 @@ configs().forEach(({ title, screenshot, config }) => {
         const select = page.locator('ion-select');
         await expect(select).toHaveScreenshot(screenshot(`select-label-floating-no-value-placeholder`));
       });
+      test('label should appear on top of the select when it is focused, has a placeholder, and no value', async ({ page }) => {
+        await page.setContent(
+          `
+           <ion-select label="Label" label-placement="floating" placeholder="Placeholder">
+             <ion-select-option value="apples">Apples</ion-select-option>
+           </ion-select>
+         `,
+          config
+        );
+
+        const select = page.locator('ion-select');
+        await select.click();
+        const cancel = page.locator("button.alert-button-role-cancel");
+        await cancel.click();
+        await expect(select).toHaveScreenshot(screenshot(`select-label-focus-floating-no-value-placeholder`));
+      });
       test('label should appear on top of the select when the select is expanded', async ({ page }) => {
         await page.setContent(
           `