diff --git a/flow-report/src/topbar.tsx b/flow-report/src/topbar.tsx index 0515164d8ac5..5d6d74753527 100644 --- a/flow-report/src/topbar.tsx +++ b/flow-report/src/topbar.tsx @@ -17,9 +17,12 @@ import {saveFile} from '../../report/renderer/api'; function saveHtml(flowResult: LH.FlowResult, htmlStr: string) { const blob = new Blob([htmlStr], {type: 'text/html'}); const filename = getFlowResultFilenamePrefix(flowResult) + '.html'; - saveFile(blob, filename); + saveHtml.saveFile(blob, filename); } +// Store `saveFile` here so we can do dependency injection. +saveHtml.saveFile = saveFile; + /* eslint-disable max-len */ const Logo: FunctionComponent = () => { return ( @@ -68,7 +71,7 @@ const TopbarButton: FunctionComponent<{ ); }; -export const Topbar: FunctionComponent<{onMenuClick: JSX.MouseEventHandler}> = +const Topbar: FunctionComponent<{onMenuClick: JSX.MouseEventHandler}> = ({onMenuClick}) => { const flowResult = useFlowResult(); const strings = useLocalizedStrings(); @@ -118,3 +121,8 @@ export const Topbar: FunctionComponent<{onMenuClick: JSX.MouseEventHandler ); }; + +export { + Topbar, + saveHtml, +}; diff --git a/flow-report/test/topbar-test.tsx b/flow-report/test/topbar-test.tsx index d9a9fabf688e..b03c0178b4ab 100644 --- a/flow-report/test/topbar-test.tsx +++ b/flow-report/test/topbar-test.tsx @@ -10,16 +10,10 @@ import {act, render} from '@testing-library/preact'; import {FlowResultContext, OptionsContext} from '../src/util'; import {I18nProvider} from '../src/i18n/i18n'; +import {Topbar, saveHtml} from '../src/topbar'; const mockSaveFile = jest.fn(); -jest.unstable_mockModule('../../../report/renderer/api.js', () => ({ - saveFile: mockSaveFile, -})); - -let Topbar: typeof import('../src/topbar').Topbar; -beforeAll(async () => { - Topbar = (await import('../src/topbar')).Topbar; -}); +const defaultSaveFile = saveHtml.saveFile; const flowResult = { name: 'User flow', @@ -47,7 +41,12 @@ beforeEach(() => { ); }); +afterEach(() => { + saveHtml.saveFile = defaultSaveFile; +}); + it('save button opens save dialog for HTML file', async () => { + saveHtml.saveFile = mockSaveFile; options = {getReportHtml: () => ''}; const root = render( {}}/>, {wrapper});