Skip to content

Commit

Permalink
removed vite plugin dts
Browse files Browse the repository at this point in the history
  • Loading branch information
@smastrom
smastrom committed Nov 26, 2022
1 parent 659224a commit 2985daf
Show file tree
Hide file tree
Showing 4 changed files with 17 additions and 191 deletions.
191 changes: 11 additions & 180 deletions cypress/e2e/Collapse.cy.ts
View file
Original file line number Diff line number Diff line change
@@ -1,191 +1,22 @@
/** Following tests are done with a transition of 300ms as
* CSS class in vite/index.css */

const trigger = '#button';
const collapse = '#collapse';
const transition = 300;
const repeatTimes = 10;
const repeat = new Array(repeatTimes).fill(undefined);
const CYPRESS_URL = Cypress.env('CYPRESS_URL');

describe('CSS properties', () => {
beforeEach(() => {
cy.visit(CYPRESS_URL);
cy.viewport('macbook-15');
});

it('Should have hidden styles applied on mount/idle', () => {
cy.get(collapse)
.should('have.class', 'transition')
.and('have.css', 'overflow', 'hidden')
.and('have.css', 'height', '0px')
.and('have.css', 'display', 'none');

cy.get(collapse)
.should('not.have.css', 'overflow', 'visible')
.and('not.have.css', 'height', '')
.and('not.have.css', 'display', 'block');
});

it('Should change styles as soon as open is triggered (next frame)', () => {
cy.get(trigger).click();

cy.get(collapse)
.should('have.css', 'overflow', 'visible')
.and('have.css', 'display', 'block');
});

it('Should never have display none if clickspamming', () => {
repeat.forEach(() => {
cy.get(trigger).click();
cy.get(collapse)
.should('have.css', 'display', 'block')
.and('not.have.css', 'display', 'none');

cy.wait(transition / 2)
.get(trigger)
.click();

cy.get(collapse)
.should('have.css', 'display', 'block')
.and('not.have.css', 'display', 'none');
});
});

it(`Should never have height 0 if clickspamming`, () => {
repeat.forEach(() => {
cy.get(trigger).click();
cy.get(collapse).should('not.have.css', 'height', '0px');

cy.wait(transition / 2)
.get(trigger)
.click();

cy.get(collapse).should('not.have.css', 'height', '0px');
});
});

it('Should have height 0 only after transition is ended', () => {
repeat.forEach(() => {
cy.get(trigger).click();
cy.get(collapse).should('not.have.css', 'height', '0px');

cy.wait(transition + 50);
cy.get(trigger).click();

cy.wait(transition + 50);
cy.get(collapse).should('have.css', 'height', '0px');
});
});
});

describe('Height in-depth', () => {
beforeEach(() => {
cy.visit(CYPRESS_URL);
cy.viewport('macbook-15');
});

it(`After complete transition height value should match scrollHeight if opened,
and equal to zero if closed`, () => {
repeat.forEach((_, index) => {
let scrollHeight;

cy.get(trigger).click();
cy.wait(transition);

cy.document().then((doc) => {
// @ts-ignore
scrollHeight = doc.getElementById('collapse').scrollHeight;
cy.get(collapse).invoke('height').should('eq', scrollHeight);
});

cy.get(trigger).click();
cy.wait(transition);
cy.document().then((doc) => {
cy.get(collapse).invoke('height').should('eq', 0);
});
});
});

it('Height should always be lower than scrollHeight if clickspamming ', () => {
repeat.forEach(() => {
cy.get(trigger).click();
cy.document().then((doc) => {
// @ts-ignore
const scrollHeight = doc.getElementById('collapse').scrollHeight;
cy.wait(100);
cy.get(collapse).invoke('height').should('be.below', scrollHeight);
});
});
});
});

describe('Resize', () => {
beforeEach(() => {
cy.visit(CYPRESS_URL);
cy.viewport('macbook-15');
});

describe("Collapse behavior/transition doesn't interfere with height when container width changes", () => {
it('Should be different if resizing with collapse opened', () => {
let scrollHeight: number;

repeat.forEach((_, index) => {
if (index === 0) {
cy.get(trigger).click();
cy.wait(transition);
}
cy.document().then((doc) => {
if (index === 0) {
// @ts-ignore
scrollHeight = doc.getElementById('collapse').scrollHeight;
}

cy.get(collapse).invoke('height').should('eq', scrollHeight);

repeat.forEach(() => {
cy.viewport('iphone-x');
cy.get(collapse).invoke('height').should('not.eq', scrollHeight);
cy.get(collapse).invoke('height').should('be.greaterThan', scrollHeight);

cy.viewport('macbook-15');
cy.get(collapse).invoke('height').should('eq', scrollHeight);
});
});
});
});

it('Should be different everytime collapse is opened at different container widths', () => {
let scrollHeight: number;

repeat.forEach((_, index) => {
cy.get(trigger).click(); // Open
cy.wait(transition);

cy.document().then((doc) => {
if (index === 0) {
// @ts-ignore
scrollHeight = doc.getElementById('collapse').scrollHeight;
}
cy.get(trigger).click(); // Close
cy.wait(transition);

cy.viewport('iphone-x');
cy.get(trigger).click(); // Open
cy.wait(transition);
cy.get(collapse).invoke('height').should('be.greaterThan', scrollHeight);
cy.get(trigger).click(); // Close
cy.wait(transition);

cy.viewport('macbook-15');
cy.get(trigger).click(); // Open
cy.wait(transition);
cy.get(collapse).invoke('height').should('eq', scrollHeight);
cy.get(trigger).click(); // Close
cy.wait(transition);
});
it('Should have default styles if collapsed on mount', () => {
cy.get('#single_collapse')
.should('have.css', 'display', 'none')
.and('have.css', 'padding', '0px')
.and('not.have.css', 'transition', '')
.and('not.have.css', 'overflow', 'hidden')
.should((element) => {
/**
* https://github.com/cypress-io/cypress/issues/6309
*/
expect(getComputedStyle(element[0]).height).to.eq('auto');
});
});
});
});

Expand Down
6 changes: 3 additions & 3 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,8 +35,9 @@
"dist"
],
"scripts": {
"build": "rimraf dist && vite build",
"postbuild": "cpy dist/Collapse.d.ts dist --rename index.d.ts --flat && rimraf dist/Collapse.d.ts",
"build": "rimraf dist && vite build && yarn declare",
"declare": "tsc src/Collapse.tsx --declaration --emitDeclarationOnly --jsx preserve",
"postbuild": "cpy src/Collapse.d.ts dist --rename index.d.ts --flat && rimraf src/Collapse.d.ts",
"build:ci": "rimraf dist && vite build --mode ci",
"cypress:dev": "NODE_ENV=DEV cypress open",
"cypress:open": "NODE_ENV=CI cypress open",
Expand All @@ -57,7 +58,6 @@
"solid-js": "^1.6.2",
"typescript": "^4.9.3",
"vite": "^3.2.4",
"vite-plugin-dts": "^1.7.1",
"vite-plugin-solid": "^2.4.0"
},
"peerDependencies": {
Expand Down
1 change: 1 addition & 0 deletions tsconfig.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
"resolveJsonModule": true,
"allowSyntheticDefaultImports": true,
"esModuleInterop": true,
"skipLibCheck": true,
"jsx": "preserve",
"jsxImportSource": "solid-js",
"types": ["vite/client"],
Expand Down
10 changes: 2 additions & 8 deletions vite.config.ts
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import { defineConfig } from 'vite';
import solidPlugin from 'vite-plugin-solid';
import dts from 'vite-plugin-dts';

import Package from './package.json';

Expand All @@ -17,19 +16,14 @@ export default defineConfig(({ mode }) => {
build: {
lib: {
name: Package.name,
entry: 'src/index.ts',
entry: 'src/Collapse.tsx',
fileName: 'index',
formats: ['es', 'cjs'],
},
rollupOptions: {
external: ['solid-js', 'solid-js/web'],
},
},
plugins: [
solidPlugin(),
dts({
include: ['src/Collapse.tsx'],
}),
],
plugins: [solidPlugin()],
};
});

0 comments on commit 2985daf

Please sign in to comment.