diff --git a/services/web/frontend/js/features/project-list/components/modals/projects-action-modal.tsx b/services/web/frontend/js/features/project-list/components/modals/projects-action-modal.tsx index 03f3289281..f0b36c9e10 100644 --- a/services/web/frontend/js/features/project-list/components/modals/projects-action-modal.tsx +++ b/services/web/frontend/js/features/project-list/components/modals/projects-action-modal.tsx @@ -57,11 +57,7 @@ function ProjectsActionModal({ useEffect(() => { if (showModal) { - eventTracking.send( - 'project-list-page-interaction', - 'project action', - action - ) + eventTracking.sendMB('project-list-page-interaction', { action }) } }, [action, showModal]) diff --git a/services/web/frontend/js/features/project-list/components/modals/rename-project-modal.tsx b/services/web/frontend/js/features/project-list/components/modals/rename-project-modal.tsx index f65d29fd5b..bad4e26e61 100644 --- a/services/web/frontend/js/features/project-list/components/modals/rename-project-modal.tsx +++ b/services/web/frontend/js/features/project-list/components/modals/rename-project-modal.tsx @@ -34,11 +34,9 @@ function RenameProjectModal({ useEffect(() => { if (showModal) { - eventTracking.send( - 'project-list-page-interaction', - 'project action', - 'Rename' - ) + eventTracking.sendMB('project-list-page-interaction', { + action: 'rename', + }) } }, [showModal]) diff --git a/services/web/frontend/js/features/project-list/components/search-form.tsx b/services/web/frontend/js/features/project-list/components/search-form.tsx index c15a92316f..f3ebc7f6cd 100644 --- a/services/web/frontend/js/features/project-list/components/search-form.tsx +++ b/services/web/frontend/js/features/project-list/components/search-form.tsx @@ -36,11 +36,7 @@ function SearchForm({ HTMLInputElement & Omit > ) => { - eventTracking.send( - 'project-list-page-interaction', - 'project-search', - 'keydown' - ) + eventTracking.sendMB('project-list-page-interaction', { action: 'search' }) setInputValue(e.target.value) } diff --git a/services/web/frontend/js/features/project-list/components/table/cells/action-buttons/copy-project-button.tsx b/services/web/frontend/js/features/project-list/components/table/cells/action-buttons/copy-project-button.tsx index 604a29a497..33d4a74167 100644 --- a/services/web/frontend/js/features/project-list/components/table/cells/action-buttons/copy-project-button.tsx +++ b/services/web/frontend/js/features/project-list/components/table/cells/action-buttons/copy-project-button.tsx @@ -33,11 +33,7 @@ function CopyProjectButton({ project, children }: CopyButtonProps) { const handleAfterCloned = useCallback( clonedProject => { - eventTracking.send( - 'project-list-page-interaction', - 'project action', - 'Clone' - ) + eventTracking.sendMB('project-list-page-interaction', { action: 'clone' }) addClonedProjectToViewData(clonedProject) updateProjectViewData({ ...project, selected: false }) setShowModal(false) diff --git a/services/web/frontend/js/features/project-list/components/table/cells/action-buttons/download-project-button.tsx b/services/web/frontend/js/features/project-list/components/table/cells/action-buttons/download-project-button.tsx index 2e6a361077..10816a4601 100644 --- a/services/web/frontend/js/features/project-list/components/table/cells/action-buttons/download-project-button.tsx +++ b/services/web/frontend/js/features/project-list/components/table/cells/action-buttons/download-project-button.tsx @@ -20,11 +20,9 @@ function DownloadProjectButton({ const location = useLocation() const downloadProject = useCallback(() => { - eventTracking.send( - 'project-list-page-interaction', - 'project action', - 'Download Zip' - ) + eventTracking.sendMB('project-list-page-interaction', { + action: 'downloadZip', + }) location.assign(`/project/${project.id}/download/zip`) }, [project, location]) diff --git a/services/web/frontend/js/features/project-list/components/table/project-tools/buttons/download-projects-button.tsx b/services/web/frontend/js/features/project-list/components/table/project-tools/buttons/download-projects-button.tsx index 8452c8c6b2..34d49e3518 100644 --- a/services/web/frontend/js/features/project-list/components/table/project-tools/buttons/download-projects-button.tsx +++ b/services/web/frontend/js/features/project-list/components/table/project-tools/buttons/download-projects-button.tsx @@ -16,11 +16,9 @@ function DownloadProjectsButton() { const projectIds = selectedProjects.map(p => p.id) const handleDownloadProjects = useCallback(() => { - eventTracking.send( - 'project-list-page-interaction', - 'project action', - 'Download Zip' - ) + eventTracking.sendMB('project-list-page-interaction', { + action: 'downloadZips', + }) location.assign(`/project/download/zip?project_ids=${projectIds.join(',')}`) diff --git a/services/web/frontend/js/features/project-list/components/table/project-tools/menu-items/copy-project-menu-item.tsx b/services/web/frontend/js/features/project-list/components/table/project-tools/menu-items/copy-project-menu-item.tsx index 790cf3086d..04c75d6952 100644 --- a/services/web/frontend/js/features/project-list/components/table/project-tools/menu-items/copy-project-menu-item.tsx +++ b/services/web/frontend/js/features/project-list/components/table/project-tools/menu-items/copy-project-menu-item.tsx @@ -31,11 +31,7 @@ function CopyProjectMenuItem() { const handleAfterCloned = useCallback( (clonedProject: Project) => { const project = selectedProjects[0] - eventTracking.send( - 'project-list-page-interaction', - 'project action', - 'Clone' - ) + eventTracking.sendMB('project-list-page-interaction', { action: 'clone' }) addClonedProjectToViewData(clonedProject) updateProjectViewData({ ...project, selected: false }) diff --git a/services/web/test/frontend/features/project-list/components/current-plan-widget.test.tsx b/services/web/test/frontend/features/project-list/components/current-plan-widget.test.tsx index ec4cf65414..7f000b52b0 100644 --- a/services/web/test/frontend/features/project-list/components/current-plan-widget.test.tsx +++ b/services/web/test/frontend/features/project-list/components/current-plan-widget.test.tsx @@ -16,16 +16,18 @@ describe('', function () { const paidPlanTooltipMessage = /click to find out how to make the most of your overleaf premium features/i + let sendMBSpy: sinon.SinonSpy + beforeEach(function () { + sendMBSpy = sinon.spy(eventTracking, 'sendMB') window.metaAttributesCache = window.metaAttributesCache || new Map() }) + afterEach(function () { + sendMBSpy.restore() + }) describe('free plan', function () { - let sendMBSpy: sinon.SinonSpy - beforeEach(function () { - sendMBSpy = sinon.spy(eventTracking, 'sendMB') - window.metaAttributesCache.set('ol-usersBestSubscription', { type: 'free', }) @@ -33,10 +35,6 @@ describe('', function () { render() }) - afterEach(function () { - sendMBSpy.restore() - }) - it('shows text and tooltip on mouseover', function () { const link = screen.getByRole('link', { name: /you’re on the free plan/i, @@ -249,8 +247,6 @@ describe('', function () { }) describe('features page split test', function () { - let sendMBSpy: sinon.SinonSpy - const variants = [ { name: 'default', link: '/learn/how-to/Overleaf_premium_features' }, { name: 'new', link: '/about/features-overview' }, @@ -285,14 +281,6 @@ describe('', function () { }, ] - beforeEach(function () { - sendMBSpy = sinon.spy(eventTracking, 'sendMB') - }) - - afterEach(function () { - sendMBSpy.restore() - }) - for (const variant of variants) { describe(`${variant.name} variant`, function () { beforeEach(function () { diff --git a/services/web/test/frontend/features/project-list/components/project-list-root.test.tsx b/services/web/test/frontend/features/project-list/components/project-list-root.test.tsx index 4b98d01c4d..da469774c8 100644 --- a/services/web/test/frontend/features/project-list/components/project-list-root.test.tsx +++ b/services/web/test/frontend/features/project-list/components/project-list-root.test.tsx @@ -25,12 +25,12 @@ const { const userId = owner.id describe('', function () { - let sendSpy: sinon.SinonSpy + let sendMBSpy: sinon.SinonSpy let assignStub: sinon.SinonStub beforeEach(async function () { global.localStorage.clear() - sendSpy = sinon.spy(eventTracking, 'send') + sendMBSpy = sinon.spy(eventTracking, 'sendMB') window.metaAttributesCache = new Map() this.tagId = '999fff999fff' this.tagName = 'First tag name' @@ -56,7 +56,7 @@ describe('', function () { }) afterEach(function () { - sendSpy.restore() + sendMBSpy.restore() window.user_id = undefined fetchMock.reset() this.locationStub.restore() @@ -806,8 +806,15 @@ describe('', function () { const modals = await screen.findAllByRole('dialog') const modal = modals[0] - expect(sendSpy).to.be.calledOnce - expect(sendSpy).calledWith('project-list-page-interaction') + expect(sendMBSpy).to.have.been.calledTwice + expect(sendMBSpy).to.have.been.calledWith('loads_v2_dash') + expect(sendMBSpy).to.have.been.calledWith( + 'project-list-page-interaction', + { + action: 'rename', + page: '/', + } + ) // same name let confirmButton = @@ -922,8 +929,15 @@ describe('', function () { cloneProjectMock.called(`/project/${projectsData[1].id}/clone`) ).to.be.true - expect(sendSpy).to.be.calledOnce - expect(sendSpy).calledWith('project-list-page-interaction') + expect(sendMBSpy).to.have.been.calledTwice + expect(sendMBSpy).to.have.been.calledWith('loads_v2_dash') + expect(sendMBSpy).to.have.been.calledWith( + 'project-list-page-interaction', + { + action: 'clone', + page: '/', + } + ) screen.getByText(copiedProjectName) }) @@ -1072,8 +1086,15 @@ describe('', function () { await fetchMock.flush(true) expect(fetchMock.done()).to.be.true - expect(sendSpy).to.be.calledOnce - expect(sendSpy).calledWith('project-list-page-interaction') + expect(sendMBSpy).to.have.been.calledTwice + expect(sendMBSpy).to.have.been.calledWith('loads_v2_dash') + expect(sendMBSpy).to.have.been.calledWith( + 'project-list-page-interaction', + { + action: 'clone', + page: '/', + } + ) expect(screen.queryByText(copiedProjectName)).to.be.null diff --git a/services/web/test/frontend/features/project-list/components/project-search.test.tsx b/services/web/test/frontend/features/project-list/components/project-search.test.tsx index adc930522f..ac2b1c8af1 100644 --- a/services/web/test/frontend/features/project-list/components/project-search.test.tsx +++ b/services/web/test/frontend/features/project-list/components/project-search.test.tsx @@ -6,12 +6,16 @@ import * as eventTracking from '../../../../../frontend/js/infrastructure/event- import fetchMock from 'fetch-mock' describe('Project list search form', function () { + let sendMBSpy: sinon.SinonSpy + beforeEach(function () { + sendMBSpy = sinon.spy(eventTracking, 'sendMB') fetchMock.reset() }) afterEach(function () { fetchMock.reset() + sendMBSpy.restore() }) it('renders the search form', function () { @@ -38,19 +42,18 @@ describe('Project list search form', function () { it('changes text', function () { const setInputValueMock = sinon.stub() - const sendSpy = sinon.spy(eventTracking, 'send') render() const input = screen.getByRole('textbox', { name: /search projects/i }) const value = 'abc' fireEvent.change(input, { target: { value } }) - expect(sendSpy).to.be.calledOnceWith( - 'project-list-page-interaction', - 'project-search', - 'keydown' - ) + + expect(sendMBSpy).to.have.been.calledOnce + expect(sendMBSpy).to.have.been.calledWith('project-list-page-interaction', { + action: 'search', + page: '/', + }) expect(setInputValueMock).to.be.calledWith(value) - sendSpy.restore() }) }) diff --git a/services/web/test/frontend/features/project-list/components/table/projects-action-modal.test.tsx b/services/web/test/frontend/features/project-list/components/table/projects-action-modal.test.tsx index 19dce5f7d5..2a0a6fa9df 100644 --- a/services/web/test/frontend/features/project-list/components/table/projects-action-modal.test.tsx +++ b/services/web/test/frontend/features/project-list/components/table/projects-action-modal.test.tsx @@ -11,14 +11,14 @@ import * as eventTracking from '../../../../../../frontend/js/infrastructure/eve describe('', function () { const actionHandler = sinon.stub().resolves({}) - let sendSpy: sinon.SinonSpy + let sendMBSpy: sinon.SinonSpy beforeEach(function () { - sendSpy = sinon.spy(eventTracking, 'send') + sendMBSpy = sinon.spy(eventTracking, 'sendMB') }) afterEach(function () { - sendSpy.restore() + sendMBSpy.restore() resetProjectListContextFetch() }) @@ -87,11 +87,10 @@ describe('', function () { /> ) - sinon.assert.calledWith( - sendSpy, - 'project-list-page-interaction', - 'project action', - 'archive' - ) + expect(sendMBSpy).to.have.been.calledOnce + expect(sendMBSpy).to.have.been.calledWith('project-list-page-interaction', { + action: 'archive', + page: '/', + }) }) })