mirror of
https://github.com/n8n-io/n8n.git
synced 2025-02-21 02:56:40 -08:00
fix: Add itemSize config to workflows view recycle scroller (no-changelog) (#6238)
* fix: Add itemSize config to workflows view recycle scroller (no-changelog) * test: add unit tests to cover recycle scroller height * fix: revert allWorkflows change * fix: fix linting issue * fix: fix sharing e2e test flakiness
This commit is contained in:
parent
4a0e1b9e02
commit
b4fd9ba94d
|
@ -161,7 +161,7 @@ describe('Sharing', () => {
|
|||
|
||||
cy.waitForLoad();
|
||||
cy.visit(workflowsPage.url);
|
||||
workflowsPage.getters.workflowCard('Workflow W2').click();
|
||||
workflowsPage.getters.workflowCard('Workflow W2').click('top');
|
||||
workflowPage.actions.executeWorkflow();
|
||||
});
|
||||
|
||||
|
|
|
@ -0,0 +1,28 @@
|
|||
import { render } from '@testing-library/vue';
|
||||
import N8nRecycleScroller from '../RecycleScroller.vue';
|
||||
|
||||
const itemSize = 100;
|
||||
const itemKey = 'id';
|
||||
const items = [...(new Array(100) as number[])].map((item, index) => ({
|
||||
id: index,
|
||||
name: `Item ${index}`,
|
||||
}));
|
||||
|
||||
describe('components', () => {
|
||||
describe('N8nRecycleScroller', () => {
|
||||
it('should render correctly', () => {
|
||||
const wrapper = render(N8nRecycleScroller, {
|
||||
propsData: {
|
||||
itemSize,
|
||||
itemKey,
|
||||
items,
|
||||
},
|
||||
});
|
||||
|
||||
expect(wrapper.container.querySelector('.recycle-scroller')).toHaveStyle(
|
||||
`height: ${itemSize * items.length}px`,
|
||||
);
|
||||
expect(wrapper.html()).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
});
|
|
@ -0,0 +1,13 @@
|
|||
// Vitest Snapshot v1
|
||||
|
||||
exports[`components > N8nRecycleScroller > should render correctly 1`] = `
|
||||
"<div class=\\"recycle-scroller-wrapper\\">
|
||||
<div class=\\"recycle-scroller\\" style=\\"height: 10000px;\\">
|
||||
<div class=\\"recycle-scroller-items-wrapper\\" style=\\"transform: translateY(0px);\\">
|
||||
<div class=\\"recycle-scroller-item\\"></div>
|
||||
<div class=\\"recycle-scroller-item\\"></div>
|
||||
<div class=\\"recycle-scroller-item\\"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>"
|
||||
`;
|
|
@ -300,7 +300,7 @@ export default mixins(debounceHelper).extend({
|
|||
typeProps: {
|
||||
type: Object as PropType<{ itemSize: number } | { columns: DatatableColumn[] }>,
|
||||
default: () => ({
|
||||
itemSize: 0,
|
||||
itemSize: 80,
|
||||
}),
|
||||
},
|
||||
},
|
||||
|
|
|
@ -5,6 +5,7 @@
|
|||
:resources="allWorkflows"
|
||||
:filters="filters"
|
||||
:additional-filters-handler="onFilter"
|
||||
:type-props="{ itemSize: 80 }"
|
||||
:show-aside="allWorkflows.length > 0"
|
||||
:shareable="isShareable"
|
||||
:initialize="initialize"
|
||||
|
|
Loading…
Reference in a new issue