diff --git a/packages/editor-ui/src/components/Projects/ProjectHeader.test.ts b/packages/editor-ui/src/components/Projects/ProjectHeader.test.ts index e0ec954118..4bc8e6d43a 100644 --- a/packages/editor-ui/src/components/Projects/ProjectHeader.test.ts +++ b/packages/editor-ui/src/components/Projects/ProjectHeader.test.ts @@ -1,4 +1,5 @@ import { createTestingPinia } from '@pinia/testing'; +import { within } from '@testing-library/dom'; import { createComponentRenderer } from '@/__tests__/render'; import { mockedStore } from '@/__tests__/utils'; import { createTestProject } from '@/__tests__/data/projects'; @@ -65,19 +66,37 @@ describe('ProjectHeader', () => { expect(container.querySelector('.fa-layer-group')).toBeVisible(); }); - it('should render the correct title', async () => { - const { getByText, rerender } = renderComponent(); + it('should render the correct title and subtitle', async () => { + const { getByText, queryByText, rerender } = renderComponent(); + const subtitle = 'All the workflows, credentials and executions you have access to'; expect(getByText('Overview')).toBeVisible(); + expect(getByText(subtitle)).toBeVisible(); projectsStore.currentProject = { type: ProjectTypes.Personal } as Project; await rerender({}); expect(getByText('Personal')).toBeVisible(); + expect(queryByText(subtitle)).not.toBeInTheDocument(); const projectName = 'My Project'; projectsStore.currentProject = { name: projectName } as Project; await rerender({}); expect(getByText(projectName)).toBeVisible(); + expect(queryByText(subtitle)).not.toBeInTheDocument(); + }); + + it('should overwrite default subtitle with slot', () => { + const defaultSubtitle = 'All the workflows, credentials and executions you have access to'; + const subtitle = 'Custom subtitle'; + + const { getByText, queryByText } = renderComponent({ + slots: { + subtitle, + }, + }); + + expect(getByText(subtitle)).toBeVisible(); + expect(queryByText(defaultSubtitle)).not.toBeInTheDocument(); }); it('should render ProjectTabs Settings if project is team project and user has update scope', () => { @@ -108,9 +127,10 @@ describe('ProjectHeader', () => { it('should render ProjectTabs without Settings if project is not team project', () => { route.params.projectId = '123'; - projectsStore.currentProject = createTestProject( - createTestProject({ type: ProjectTypes.Personal, scopes: ['project:update'] }), - ); + projectsStore.currentProject = createTestProject({ + type: ProjectTypes.Personal, + scopes: ['project:update'], + }); renderComponent(); expect(projectTabsSpy).toHaveBeenCalledWith( @@ -120,4 +140,23 @@ describe('ProjectHeader', () => { null, ); }); + + test.each([ + [null, 'Create'], + [createTestProject({ type: ProjectTypes.Personal }), 'Create in personal'], + [createTestProject({ type: ProjectTypes.Team }), 'Create in project'], + ])('in project %s should render correct create button label %s', (project, label) => { + projectsStore.currentProject = project; + const { getByTestId } = renderComponent({ + global: { + stubs: { + N8nNavigationDropdown: { + template: '