From d810fd2d19498de9846b7613ee196b201e83ccb7 Mon Sep 17 00:00:00 2001 From: Kelly Carino Date: Tue, 19 Apr 2022 13:00:24 -0700 Subject: [PATCH] fix(ui): Handle Email dropdown in alert creator for Safari (#33741) Safari is disregarding autocomplete='off' and still showing the browser autocomplete for the select action field in the alerts creator. This is due to the first/default option being set as Email, so having an invisible character to break up the word seems to fix this. Seems to be an open issue with react-select and the other solutions mentioned here don't work for Safari https://github.com/JedWatson/react-select/issues/3500. FIXES WOR-1779 --- static/app/views/alerts/incidentRules/types.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/static/app/views/alerts/incidentRules/types.tsx b/static/app/views/alerts/incidentRules/types.tsx index b5cdf9fd5934c..1fa95da834b64 100644 --- a/static/app/views/alerts/incidentRules/types.tsx +++ b/static/app/views/alerts/incidentRules/types.tsx @@ -141,7 +141,9 @@ export enum ActionType { } export const ActionLabel = { - [ActionType.EMAIL]: t('Email'), + // \u200B is needed because Safari disregards autocomplete="off". It's seeing "Email" and + // opening up the browser autocomplete for email. https://github.com/JedWatson/react-select/issues/3500 + [ActionType.EMAIL]: t('Emai\u200Bl'), [ActionType.SLACK]: t('Slack'), [ActionType.PAGERDUTY]: t('Pagerduty'), [ActionType.MSTEAMS]: t('MS Teams'),