e2e: record message_sent interaction

src/CONST.ts

@@ -917,6 +917,7 @@ const CONST = {
         SWITCH_REPORT: 'switch_report',
         SIDEBAR_LOADED: 'sidebar_loaded',
         LOAD_SEARCH_OPTIONS: 'load_search_options',
+        MESSAGE_SENT: 'message_sent',
         COLD: 'cold',
         WARM: 'warm',
         REPORT_ACTION_ITEM_LAYOUT_DEBOUNCE_TIME: 1500,

src/libs/E2E/tests/reportTypingTest.e2e.ts

@@ -5,14 +5,18 @@ import waitForAppLoaded from '@libs/E2E/actions/waitForAppLoaded';
 import waitForKeyboard from '@libs/E2E/actions/waitForKeyboard';
 import E2EClient from '@libs/E2E/client';
 import getConfigValueOrThrow from '@libs/E2E/utils/getConfigValueOrThrow';
+import getPromiseWithResolve from '@libs/E2E/utils/getPromiseWithResolve';
 import Navigation from '@libs/Navigation/Navigation';
 import Performance from '@libs/Performance';
 import {getRerenderCount, resetRerenderCount} from '@pages/home/report/ReportActionCompose/ComposerWithSuggestions/index.e2e';
+import {onSubmitAction} from '@pages/home/report/ReportActionCompose/ReportActionCompose';
 import CONST from '@src/CONST';
 import ROUTES from '@src/ROUTES';
 import * as NativeCommands from '../../../../tests/e2e/nativeCommands/NativeCommandsAction';
 
 const test = (config: NativeConfig) => {
+    const message = `Measure_performance#${Math.floor(Math.random() * 1000000)}`;
+
     // check for login (if already logged in the action will simply resolve)
     console.debug('[E2E] Logging in for typing');
 
@@ -28,7 +32,25 @@ const test = (config: NativeConfig) => {
 
         console.debug('[E2E] Logged in, getting typing metrics and submitting them…');
 
+        const [renderTimesPromise, renderTimesResolve] = getPromiseWithResolve();
+        const [messageSentPromise, messageSentResolve] = getPromiseWithResolve();
+
+        Promise.all([renderTimesPromise, messageSentPromise]).then(() => {
+            console.debug(`[E2E] Submitting!`);
+
+            E2EClient.submitTestDone();
+        });
+
         Performance.subscribeToMeasurements((entry) => {
+            if (entry.name === CONST.TIMING.MESSAGE_SENT) {
+                E2EClient.submitTestResults({
+                    branch: Config.E2E_BRANCH,
+                    name: 'Message sent',
+                    duration: entry.duration,
+                }).then(messageSentResolve);
+                return;
+            }
+
             if (entry.name !== CONST.TIMING.SIDEBAR_LOADED) {
                 return;
             }
@@ -46,17 +68,25 @@ const test = (config: NativeConfig) => {
                         return Promise.resolve();
                     })
                     .then(() => E2EClient.sendNativeCommand(NativeCommands.makeTypeTextCommand('A')))
-                    .then(() => {
-                        setTimeout(() => {
-                            const rerenderCount = getRerenderCount();
+                    .then(
+                        () =>
+                            new Promise((resolve) => {
+                                setTimeout(() => {
+                                    const rerenderCount = getRerenderCount();
 
-                            E2EClient.submitTestResults({
-                                branch: Config.E2E_BRANCH,
-                                name: 'Composer typing rerender count',
-                                renderCount: rerenderCount,
-                            }).then(E2EClient.submitTestDone);
-                        }, 3000);
-                    })
+                                    E2EClient.submitTestResults({
+                                        branch: Config.E2E_BRANCH,
+                                        name: 'Composer typing rerender count',
+                                        renderCount: rerenderCount,
+                                    })
+                                        .then(renderTimesResolve)
+                                        .then(resolve);
+                                }, 3000);
+                            }),
+                    )
+                    .then(() => E2EClient.sendNativeCommand(NativeCommands.makeBackspaceCommand()))
+                    .then(() => E2EClient.sendNativeCommand(NativeCommands.makeTypeTextCommand(message)))
+                    .then(() => onSubmitAction())
                     .catch((error) => {
                         console.error('[E2E] Error while test', error);
                         E2EClient.submitTestDone();

src/pages/home/report/ReportActionCompose/ReportActionCompose.tsx

@@ -37,10 +37,12 @@ import * as EmojiPickerActions from '@userActions/EmojiPickerAction';
 import * as Report from '@userActions/Report';
 import * as User from '@userActions/User';
 import CONST from '@src/CONST';
+import Performance from '@libs/Performance';
 import ONYXKEYS from '@src/ONYXKEYS';
 import type * as OnyxTypes from '@src/types/onyx';
 import type * as OnyxCommon from '@src/types/onyx/OnyxCommon';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
+import noop from 'lodash/noop';
 import AttachmentPickerWithMenuItems from './AttachmentPickerWithMenuItems';
 import ComposerWithSuggestions from './ComposerWithSuggestions';
 import type {ComposerWithSuggestionsProps} from './ComposerWithSuggestions/ComposerWithSuggestions';
@@ -102,6 +104,8 @@ const shouldFocusInputOnScreenFocus = canFocusInputOnScreenFocus();
 
 const willBlurTextInputOnTapOutside = willBlurTextInputOnTapOutsideFunc();
 
+let onSubmitAction = noop;
+
 function ReportActionCompose({
     blockedFromConcierge,
     currentUserPersonalDetails = {},
@@ -295,12 +299,16 @@ function ReportActionCompose({
                 return;
             }
 
+            Performance.markStart(CONST.TIMING.MESSAGE_SENT, {message: newComment});
+
             playSound(SOUNDS.DONE);
             onSubmit(newComment);
         },
         [onSubmit],
     );
 
+    onSubmitAction = submitForm;
+
     const onTriggerAttachmentPicker = useCallback(() => {
         isNextModalWillOpenRef.current = true;
         isKeyboardVisibleWhenShowingModalRef.current = true;
@@ -525,5 +533,5 @@ export default withCurrentUserPersonalDetails(
         },
     })(memo(ReportActionCompose)),
 );
-
+export {onSubmitAction};
 export type {SuggestionsRef, ComposerRef};

src/pages/home/report/comment/TextCommentFragment.tsx

@@ -1,6 +1,6 @@
 import Str from 'expensify-common/lib/str';
 import {isEmpty} from 'lodash';
-import React, {memo} from 'react';
+import React, {memo, useEffect} from 'react';
 import type {StyleProp, TextStyle} from 'react-native';
 import Text from '@components/Text';
 import ZeroWidthView from '@components/ZeroWidthView';
@@ -13,6 +13,7 @@ import * as DeviceCapabilities from '@libs/DeviceCapabilities';
 import * as EmojiUtils from '@libs/EmojiUtils';
 import variables from '@styles/variables';
 import CONST from '@src/CONST';
+import Performance from '@libs/Performance';
 import type {OriginalMessageSource} from '@src/types/onyx/OriginalMessage';
 import type {Message} from '@src/types/onyx/ReportAction';
 import RenderCommentHTML from './RenderCommentHTML';
@@ -48,6 +49,10 @@ function TextCommentFragment({fragment, styleAsDeleted, styleAsMuted = false, so
     const {translate} = useLocalize();
     const {isSmallScreenWidth} = useWindowDimensions();
 
+    useEffect(() => {
+        Performance.markEnd(CONST.TIMING.MESSAGE_SENT, {message: text});
+    }, [text]);
+
     // If the only difference between fragment.text and fragment.html is <br /> tags and emoji tag
     // on native, we render it as text, not as html
     // on other device, only render it as text if the only difference is <br /> tag

tests/e2e/nativeCommands/adbBackspace.ts

@@ -1,10 +1,9 @@
 import execAsync from '../utils/execAsync';
 import * as Logger from '../utils/logger';
 
-const adbBackspace = () => {
+const adbBackspace = (): Promise<boolean> => {
     Logger.log(`🔙 Pressing backspace`);
-    execAsync(`adb shell input keyevent KEYCODE_DEL`);
-    return true;
+    return execAsync(`adb shell input keyevent KEYCODE_DEL`).then(() => true);
 };
 
 export default adbBackspace;

tests/e2e/nativeCommands/adbTypeText.ts

@@ -3,8 +3,7 @@ import * as Logger from '../utils/logger';
 
 const adbTypeText = (text: string) => {
     Logger.log(`📝 Typing text: ${text}`);
-    execAsync(`adb shell input text "${text}"`);
-    return true;
+    return execAsync(`adb shell input text "${text}"`).then(() => true);
 };
 
 export default adbTypeText;

tests/e2e/nativeCommands/index.ts

@@ -4,7 +4,7 @@ import adbTypeText from './adbTypeText';
 // eslint-disable-next-line rulesdir/prefer-import-module-contents
 import {NativeCommandsAction} from './NativeCommandsAction';
 
-const executeFromPayload = (actionName?: string, payload?: NativeCommandPayload): boolean => {
+const executeFromPayload = (actionName?: string, payload?: NativeCommandPayload): Promise<boolean> => {
     switch (actionName) {
         case NativeCommandsAction.scroll:
             throw new Error('Not implemented yet');

tests/e2e/server/index.ts

@@ -144,8 +144,8 @@ const createServerInstance = (): ServerInstance => {
 
             case Routes.testNativeCommand: {
                 getPostJSONRequestData<NativeCommand>(req, res)
-                    ?.then((data) => {
-                        const status = nativeCommands.executeFromPayload(data?.actionName, data?.payload);
+                    ?.then((data) => nativeCommands.executeFromPayload(data?.actionName, data?.payload))
+                    .then((status) => {
                         if (status) {
                             res.end('ok');
                             return;