fix: mf-5560 twitter toolbar DOM gets updated (#11050)

DimensionDev · Oct 30, 2023 · 70dc506 · 70dc506
1 parent 827c09c
commit 70dc506
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 7 deletions.
diff --git a/packages/mask/src/components/InjectedComponents/PostDialogHint.tsx b/packages/mask/src/components/InjectedComponents/PostDialogHint.tsx
@@ -22,7 +22,7 @@ interface PostDialogHintUIProps extends withClasses<'buttonTransform' | 'iconBut
 const useStyles = makeStyles()((theme) => ({
     button: {
         // TODO: is it correct? (what about twitter?)
-        padding: isMobileFacebook ? 0 : '7px',
+        padding: isMobileFacebook ? 0 : '10px',
     },
     text: {
         color: theme.palette.grey[300],
@@ -42,12 +42,12 @@ const ICON_MAP: Record<string, JSX.Element> = {
     default: <Icons.SharpMask size={17} color={MaskColors.light.maskColor.publicTwitter} />,
 }
 
-const EntryIconButton = memo((props: PostDialogHintUIProps) => {
+const EntryIconButton = memo(function EntryIconButton(props: PostDialogHintUIProps) {
     const { t } = useMaskSharedTrans()
     const { tooltip, disableGuideTip } = props
     const { classes, cx } = useStyles(undefined, { props })
 
-    const getEntry = () => (
+    const Entry = (
         <ShadowRootTooltip
             title={t('mask_network')}
             placement={tooltip?.placement}
@@ -66,10 +66,10 @@ const EntryIconButton = memo((props: PostDialogHintUIProps) => {
     )
 
     return disableGuideTip ? (
-        getEntry()
+        Entry
     ) : (
         <GuideStep step={4} total={4} tip={t('user_guide_tip_4')} onComplete={props.onHintButtonClicked}>
-            {getEntry()}
+            {Entry}
         </GuideStep>
     )
 })

diff --git a/packages/mask/src/site-adaptors/twitter.com/utils/selector.ts b/packages/mask/src/site-adaptors/twitter.com/utils/selector.ts
@@ -88,7 +88,9 @@ export const postEditorContentInPopupSelector: () => LiveSelector<E, true> = ()
         '[aria-labelledby="modal-header"] > div:first-child > div:first-child > div:first-child > div:nth-child(3)',
     )
 export const postEditorInPopupSelector: () => LiveSelector<E, true> = () =>
-    querySelector<E>('[aria-labelledby="modal-header"]  div[data-testid="toolBar"] div[data-testid="geoButton"]')
+    querySelector<E>(
+        '[aria-labelledby="modal-header"]  div[data-testid="toolBar"] [role="presentation"]:has(> div[data-testid="geoButton"])',
+    )
 export const sideBarProfileSelector: () => LiveSelector<E, true> = () =>
     querySelector<E>('[role="banner"] [role="navigation"] [data-testid="AppTabBar_Profile_Link"] > div')
 export const postEditorInTimelineSelector: () => LiveSelector<E, true> = () =>
@@ -267,7 +269,7 @@ export const searchTwitterAvatarNFTLinkSelector = () => querySelector<E>('a[href
 
 export const searchReplyToolbarSelector = () =>
     querySelector<E>('div[data-testid="primaryColumn"] div[data-testid="toolBar"]').querySelector<E>(
-        'div[data-testid="geoButton"]',
+        '[role="presentation"]:has(> div[data-testid="geoButton"])',
     )
 
 // nameTag dom