From c8f7bc54bcbf43d2e0dafe120890f89ed22d2317 Mon Sep 17 00:00:00 2001 From: Mathias Jakobsen Date: Mon, 17 Apr 2023 16:06:09 +0100 Subject: [PATCH] [web] Add split test for testing editor switch naming (#12596) Co-authored-by: Ieva Vaiginyte <95856891+ievaoverleaf@users.noreply.github.com> GitOrigin-RevId: dafe07bda841dad962ebf2894718750fafe86373 --- .../src/Features/Project/ProjectController.js | 78 +++++++++++++++---- .../web/app/views/project/editor/meta.pug | 2 + .../components/editor-switch.tsx | 19 ++++- 3 files changed, 82 insertions(+), 17 deletions(-) diff --git a/services/web/app/src/Features/Project/ProjectController.js b/services/web/app/src/Features/Project/ProjectController.js index cb6ab7d193..7e38ecc940 100644 --- a/services/web/app/src/Features/Project/ProjectController.js +++ b/services/web/app/src/Features/Project/ProjectController.js @@ -46,6 +46,8 @@ const SurveyHandler = require('../Survey/SurveyHandler') const ProjectAuditLogHandler = require('./ProjectAuditLogHandler') const PublicAccessLevels = require('../Authorization/PublicAccessLevels') +const VISUAL_EDITOR_NAMING_SPLIT_TEST_MIN_SIGNUP_DATE = new Date('2023-04-17') + /** * @typedef {import("./types").GetProjectsRequest} GetProjectsRequest * @typedef {import("./types").GetProjectsResponse} GetProjectsResponse @@ -903,21 +905,60 @@ const ProjectController = { } ) }, - legacySourceEditorAssignment(cb) { - SplitTestHandler.getAssignment( - req, - res, - 'source-editor-legacy', - (error, assignment) => { - // do not fail editor load if assignment fails - if (error) { - cb(null, { variant: 'default' }) - } else { - cb(null, assignment) - } + participatingInVisualEditorNamingTest: [ + 'user', + (results, cb) => { + const isNewUser = + results.user.signUpDate >= + VISUAL_EDITOR_NAMING_SPLIT_TEST_MIN_SIGNUP_DATE + cb(null, isNewUser) + }, + ], + visualEditorNameAssignment: [ + 'participatingInVisualEditorNamingTest', + (results, cb) => { + if (!results.participatingInVisualEditorNamingTest) { + cb(null, { variant: 'default' }) + } else { + SplitTestHandler.getAssignment( + req, + res, + 'visual-editor-name', + (error, assignment) => { + if (error) { + cb(null, { variant: 'default' }) + } else { + cb(null, assignment) + } + } + ) } - ) - }, + }, + ], + legacySourceEditorAssignment: [ + 'participatingInVisualEditorNamingTest', + 'visualEditorNameAssignment', + (results, cb) => { + // Hide Ace for people in the Rich Text naming test + if (results.participatingInVisualEditorNamingTest) { + cb(null, { variant: 'true' }) + } else { + SplitTestHandler.getAssignment( + req, + res, + 'source-editor-legacy', + (error, assignment) => { + // do not fail editor load if assignment fails + if (error) { + cb(null, { variant: 'default' }) + } else { + cb(null, assignment) + } + } + ) + } + }, + ], pdfjsAssignment(cb) { SplitTestHandler.getAssignment( req, @@ -1148,6 +1189,8 @@ const ProjectController = { isTokenMember, isInvitedMember, brandVariation, + visualEditorNameAssignment, + participatingInVisualEditorNamingTest, legacySourceEditorAssignment, pdfjsAssignment, editorLeftMenuAssignment, @@ -1271,6 +1314,11 @@ const ProjectController = { detachRole === 'detached' ? 'project/editor_detached' : 'project/editor' + + const isParticipatingInVisualEditorNamingTest = + Features.hasFeature('saas') && + participatingInVisualEditorNamingTest + res.render(template, { title: project.name, priority_title: true, @@ -1336,6 +1384,8 @@ const ProjectController = { ), pdfjsVariant: pdfjsAssignment.variant, debugPdfDetach, + isParticipatingInVisualEditorNamingTest, + visualEditorNameVariant: visualEditorNameAssignment.variant, showLegacySourceEditor, showSymbolPalette, galileoEnabled, diff --git a/services/web/app/views/project/editor/meta.pug b/services/web/app/views/project/editor/meta.pug index a826cb9c23..d734416046 100644 --- a/services/web/app/views/project/editor/meta.pug +++ b/services/web/app/views/project/editor/meta.pug @@ -23,6 +23,8 @@ meta(name="ol-wsRetryHandshake" data-type="json" content=settings.wsRetryHandsha meta(name="ol-pdfjsVariant" content=pdfjsVariant) meta(name="ol-debugPdfDetach" data-type="boolean" content=debugPdfDetach) meta(name="ol-showLegacySourceEditor", data-type="boolean" content=showLegacySourceEditor) +meta(name="ol-visualEditorNameVariant", data-type="string" content=visualEditorNameVariant) +meta(name="ol-isParticipatingInVisualEditorNamingTest", data-type="boolean" content=isParticipatingInVisualEditorNamingTest) meta(name="ol-showSymbolPalette" data-type="boolean" content=showSymbolPalette) meta(name="ol-galileoEnabled" data-type="string" content=galileoEnabled) meta(name="ol-galileoPromptWords" data-type="string" content=galileoPromptWords) diff --git a/services/web/frontend/js/features/source-editor/components/editor-switch.tsx b/services/web/frontend/js/features/source-editor/components/editor-switch.tsx index 1c626890fc..ec0fb23f37 100644 --- a/services/web/frontend/js/features/source-editor/components/editor-switch.tsx +++ b/services/web/frontend/js/features/source-editor/components/editor-switch.tsx @@ -41,12 +41,22 @@ function Badge() { } const showLegacySourceEditor: boolean = getMeta('ol-showLegacySourceEditor') +const visualEditorNameVariant: string = getMeta('ol-visualEditorNameVariant') +const isParticipatingInVisualEditorNamingTest: boolean = getMeta( + 'ol-isParticipatingInVisualEditorNamingTest' +) function EditorSwitch() { const [newSourceEditor, setNewSourceEditor] = useScopeValue( 'editor.newSourceEditor' ) const [richText, setRichText] = useScopeValue('editor.showRichText') + const sourceName = + visualEditorNameVariant === 'code-visual' + ? 'Code Editor' + : visualEditorNameVariant === 'source-visual' + ? 'Source Editor' + : 'Source' const [visual, setVisual] = useScopeValue('editor.showVisual') @@ -106,7 +116,7 @@ function EditorSwitch() { onChange={handleChange} /> {showLegacySourceEditor ? ( @@ -133,7 +143,7 @@ function EditorSwitch() { /> - {!!richTextOrVisual && ( + {!!richTextOrVisual && !isParticipatingInVisualEditorNamingTest && ( )} @@ -147,6 +157,9 @@ const RichTextToggle: FC<{ }> = ({ checked, disabled, handleChange }) => { const { t } = useTranslation() + const richTextName = + visualEditorNameVariant === 'default' ? 'Rich Text' : 'Visual Editor' + const toggle = ( )