[Awaiting checklist completion] [$250] Web - Instances are not copiable using the right click

[izarutskaya]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Version Number: 9.2.19-0
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught during regression testing, add the test name, ID and link from TestRail: Edge Cases - Issue to retest #58234
Email or phone of affected tester (no customers):
Issue reported by: Applause Internal Team
Device used:
App Component:

Action Performed:

1. Login to any account
2. Go to Account and select any Workspace -> Members and select a member, Right click on the email field
3. Select Profile and Right click on the email field
4. Go to any Workspace not owned by the user, Right click on the address field
5. Go to any paid report, with a merchant provided, Right click on the merchant field
6. Go to any paid distance expense, Right click on the distance, rate and date fields
7. Go to settings -> Wallet, open the card under Assigned cards, reveal the details and Right click on the card number field

Expected Result:

All these instances are copiable using the right click pattern.

Actual Result:

Instances are not copiable using the right click

Workaround:

Unknown

Platforms:

• Android: App
• Android: mWeb Chrome
• iOS: App
• iOS: mWeb Safari
• iOS: mWeb Chrome
• Windows: Chrome
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Bug6930418_1757506729947.1756496331298_Screen_Recording_2025-08-29_at_10.22.56_at_night.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021972628469905125128
• Upwork Job ID: 1972628469905125128
• Last Price Increase: 2025-09-29
• Automatic offers:
• ShridharGoel | Contributor | 109022725

Issue Owner

Current Issue Owner: @

Issue Owner

Current Issue Owner: @dukenv0307

[melvin-bot]

Triggered auto assignment to @twisterdotcom (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[Eskalifer1]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Web - Instances are not copiable using the right click

What is the root cause of that problem?

Coming from here: #69050

We added check for !deviceHasHoverSupport, so when device doesnt have hover we call function to copy:

App/src/components/MenuItem.tsx

Lines 643 to 654 in 9417310

	const secondaryInteraction = (event: GestureResponderEvent | MouseEvent) => {
	if (!copyValue) {
	return;
	}
	showContextMenu({
	type: CONST.CONTEXT_MENU_TYPES.TEXT,
	event,
	selection: copyValue,
	contextMenuAnchor: popoverAnchor.current,
	});
	onSecondaryInteraction?.(event);
	};

App/src/components/MenuItem.tsx

Line 683 in 9417310

onSecondaryInteraction={copyable && !deviceHasHoverSupport ? secondaryInteraction : onSecondaryInteraction}

What changes do you think we should make in order to solve the problem?

hasHoverSupport - returns false on native devices and phones, so the menu is called, but on PCs this value returns true, so its callback will be false, which is why the menu is not called

We need to call a callback on PCs so that if hasHoverSupport is true, then the menu is called, and on mobile devices, leave it as it is.

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

N/A

What alternative solutions did you explore? (Optional)

1. Use canUseTouchScreen instead of hasHoverSupport

2. Remove the check for hasHoverSupport altogether; I couldn't reproduce the bug for which it was added.
   Reminder: Please use plain English, be brief and avoid jargon. Feel free to use images, charts or pseudo-code if necessary. Do not post large multi-line diffs or write walls of text. Do not create PRs unless you have been hired for this job.

[lorretheboy]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Instances are not copiable using the right click

What is the root cause of that problem?

We currently only able to copy value through right click on devices don't support hover

App/src/components/MenuItem.tsx

Line 683 in bda0a35

onSecondaryInteraction={copyable && !deviceHasHoverSupport ? secondaryInteraction : onSecondaryInteraction}

What changes do you think we should make in order to solve the problem?

We should update conditions to copyable && !interactive ? secondaryInteraction : onSecondaryInteraction which means: "if copyable is true AND interactive is false". This will enable copy functionality only for non-interactive copyable items

Note: we also have to double every place again and add interactive={false} for not-working yet places

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

NA

What alternative solutions did you explore? (Optional)

Reminder: Please use plain English, be brief and avoid jargon. Feel free to use images, charts or pseudo-code if necessary. Do not post large multi-line diffs or write walls of text. Do not create PRs unless you have been hired for this job.

[ShridharGoel]

🚨 Edited by proposal-police: This proposal was edited at 2025-09-29 17:55:10 UTC.

Proposal

Please re-state the problem that we are trying to solve in this issue.

Right-clicking contact details, workspace metadata, and read-only expense fields in the web app does not show Expensify’s copy context menu, so users cannot copy these values without opening the browser’s developer tools or editing the data.

What is the root cause of that problem?

The shared MenuItem component only wired the context-menu handler when hover support was absent, so on desktop devices the right-click event never opened the copy menu. As a result, every consumer relying solely on copyable lost right-click copy.

See MenuItem.tsx for the original guard that skipped registering the handler when hover support existed:

App/src/components/MenuItem.tsx

Lines 642 to 683 in b315370

	const secondaryInteraction = (event: GestureResponderEvent | MouseEvent) => {
	if (!copyValue) {
	return;
	}
	showContextMenu({
	type: CONST.CONTEXT_MENU_TYPES.TEXT,
	event,
	selection: copyValue,
	contextMenuAnchor: popoverAnchor.current,
	});
	onSecondaryInteraction?.(event);
	};
	const isIDPassed = !!iconReportID || !!iconAccountID || iconAccountID === CONST.DEFAULT_NUMBER_ID;
	return (
	<View onBlur={onBlur}>
	{!!label && !isLabelHoverable && (
	<View style={[styles.ph5, labelStyle]}>
	<Text style={StyleUtils.combineStyles([styles.sidebarLinkText, styles.optionAlternateText, styles.textLabelSupporting, styles.pre])}>{label}</Text>
	</View>
	)}
	<EducationalTooltip
	shouldRender={shouldRenderTooltip}
	anchorAlignment={tooltipAnchorAlignment}
	renderTooltipContent={renderTooltipContent}
	wrapperStyle={tooltipWrapperStyle}
	shiftHorizontal={tooltipShiftHorizontal}
	shiftVertical={tooltipShiftVertical}
	shouldTeleportPortalToModalLayer={shouldTeleportPortalToModalLayer}
	onTooltipPress={onEducationTooltipPress}
	shouldHideOnScroll={shouldHideOnScroll}
	>
	<View>
	<Hoverable>
	{(isHovered) => (
	<PressableWithSecondaryInteraction
	onPress={shouldCheckActionAllowedOnPress ? callFunctionIfActionIsAllowed(onPressAction, isAnonymousAction) : onPressAction}
	onPressIn={() => shouldBlockSelection && shouldUseNarrowLayout && canUseTouchScreen() && ControlSelection.block()}
	onPressOut={ControlSelection.unblock}
	onSecondaryInteraction={copyable && !deviceHasHoverSupport ? secondaryInteraction : onSecondaryInteraction}
	wrapperStyle={outerWrapperStyle}

What changes do you think we should make in order to solve the problem?

We can reuse the existing secondaryInteraction helper whenever a copyable value is present, so both long-press and right-click consistently expose the copy context menu. We also mark read-only surfaces as copyable to ensure the handler actually attaches.

<PressableWithSecondaryInteraction
    onPress={shouldCheckActionAllowedOnPress ? callFunctionIfActionIsAllowed(onPressAction, isAnonymousAction) : onPressAction}
    onPressIn={() => shouldBlockSelection && shouldUseNarrowLayout && canUseTouchScreen() && ControlSelection.block()}
    onPressOut={ControlSelection.unblock}
    onSecondaryInteraction={copyable ? secondaryInteraction : onSecondaryInteraction}
    wrapperStyle={outerWrapperStyle}
    …
/>

<MenuItemWithTopDescription
    description={translate('common.merchant')}
    title={updatedMerchantTitle}
    interactive={canEditMerchant}
    shouldShowRightIcon={canEditMerchant}
    …
    copyValue={!canEditMerchant ? updatedMerchantTitle : undefined}
    copyable={!canEditMerchant && Boolean(updatedMerchantTitle)}
/>

We'll need to pass copyable in a similar way at other places as well.

Screen.Recording.2025-09-29.at.2.50.45.PM.mov

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

New tests can be added.

[nyomanjyotisa]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Right-click copy functionality is not working for copyable instances

What is the root cause of that problem?

The condition copyable && !deviceHasHoverSupport excludes devices with hover support from using right-click copy functionality

App/src/components/MenuItem.tsx

Line 683 in 9417310

onSecondaryInteraction={copyable && !deviceHasHoverSupport ? secondaryInteraction : onSecondaryInteraction}

What changes do you think we should make in order to solve the problem?

We can enable right-click copy functionality whenever an item is marked as copyable and has a value to copy

onSecondaryInteraction={copyable && copyValue ? secondaryInteraction : onSecondaryInteraction}

App/src/components/MenuItem.tsx

Line 683 in 9417310

onSecondaryInteraction={copyable && !deviceHasHoverSupport ? secondaryInteraction : onSecondaryInteraction}

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

None

What alternative solutions did you explore? (Optional)

None

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~021972628469905125128

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @dukenv0307 (External)

[twisterdotcom]

This is a regression though right?

cc @sosek108 and @jjcoffee who implemented and reviewed #58234