Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(vite): e2e fixes for crystal #8

Draft
wants to merge 1 commit into
base: crystal-default
Choose a base branch
from
Draft

fix(vite): e2e fixes for crystal #8

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 0 additions & 37 deletions e2e/vite/src/vite-legacy.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import {
cleanupProject,
killProcessAndPorts,
newProject,
readJson,
runCLI,
runCommandUntil,
uniq,
Expand Down Expand Up @@ -78,40 +77,4 @@ describe('@nx/vite/plugin', () => {
}
});
});

describe('react with vitest only', () => {
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not needed for e2e. This can be checked within unit tests, and is indeed being checked in unit tests.

const reactVitest = uniq('reactVitest');

beforeAll(() => {
originalEnv = process.env.NX_ADD_PLUGINS;
process.env.NX_ADD_PLUGINS = 'false';
proj = newProject({
packages: ['@nx/vite', '@nx/react'],
});
runCLI(
`generate @nx/react:app ${reactVitest} --bundler=webpack --unitTestRunner=vitest --e2eTestRunner=none --projectNameAndRootFormat=as-provided`
);
});

afterAll(() => {
process.env.NODE_ENV = originalEnv;
cleanupProject();
});

it('should contain targets build, test and lint', () => {
const nxJson = readJson('nx.json');

const vitePlugin = nxJson.plugins.find(
(p) => p.plugin === '@nx/vite/plugin'
);
expect(vitePlugin).toBeDefined();
expect(vitePlugin.options.buildTargetName).toEqual('build');
expect(vitePlugin.options.testTargetName).toEqual('test');
});

it('project.json should not contain test target', () => {
const projectJson = readJson(`${reactVitest}/project.json`);
expect(projectJson.targets.test).toBeUndefined();
});
});
});
163 changes: 3 additions & 160 deletions e2e/vite/src/vite.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,6 @@ import {
listFiles,
newProject,
readFile,
readJson,
removeFile,
rmDist,
runCLI,
runCommand,
Expand All @@ -21,7 +19,6 @@ import {
updateJson,
checkFilesExist,
} from '@nx/e2e/utils';
import { join } from 'path';

const myApp = uniq('my-app');

Expand Down Expand Up @@ -68,84 +65,12 @@ describe('Vite Plugin', () => {
expect(fileExists(`dist/apps/${myApp}/package.json`)).toBeFalsy();
rmDist();
}, 200_000);

it('should build application with new package json generation', async () => {
runCLI(`build ${myApp} --generatePackageJson`);
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

generatePackageJson not supported by vite natively

expect(readFile(`dist/apps/${myApp}/index.html`)).toBeDefined();
const fileArray = listFiles(`dist/apps/${myApp}/assets`);
const mainBundle = fileArray.find((file) => file.endsWith('.js'));
expect(
readFile(`dist/apps/${myApp}/assets/${mainBundle}`)
).toBeDefined();

const packageJson = readJson(`dist/apps/${myApp}/package.json`);
expect(packageJson).toEqual({
name: myApp,
version: '0.0.1',
type: 'module',
});
rmDist();
}, 200_000);

it('should build application with existing package json generation', async () => {
createFile(
`apps/${myApp}/package.json`,
JSON.stringify({
name: 'my-existing-app',
version: '1.0.1',
scripts: {
start: 'node server.js',
},
})
);
runCLI(`build ${myApp} --generatePackageJson`);
expect(readFile(`dist/apps/${myApp}/index.html`)).toBeDefined();
const fileArray = listFiles(`dist/apps/${myApp}/assets`);
const mainBundle = fileArray.find((file) => file.endsWith('.js'));
expect(
readFile(`dist/apps/${myApp}/assets/${mainBundle}`)
).toBeDefined();

const packageJson = readJson(`dist/apps/${myApp}/package.json`);
expect(packageJson).toEqual({
name: 'my-existing-app',
version: '1.0.1',
type: 'module',
scripts: {
start: 'node server.js',
},
});
rmDist();
}, 200_000);

it('should build application without copying exisiting package json when generatePackageJson=false', async () => {
createFile(
`apps/${myApp}/package.json`,
JSON.stringify({
name: 'my-existing-app',
version: '1.0.1',
scripts: {
start: 'node server.js',
},
})
);
runCLI(`build ${myApp} --generatePackageJson=false`);
expect(readFile(`dist/apps/${myApp}/index.html`)).toBeDefined();
const fileArray = listFiles(`dist/apps/${myApp}/assets`);
const mainBundle = fileArray.find((file) => file.endsWith('.js'));
expect(
readFile(`dist/apps/${myApp}/assets/${mainBundle}`)
).toBeDefined();

expect(fileExists(`dist/apps/${myApp}/package.json`)).toBe(false);
rmDist();
}, 200_000);
});

100_000;
});

describe('incremental building', () => {
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

change this test to just test the building of dependencies

describe('build project dependencies too', () => {
const app = uniq('demo');
const lib = uniq('my-lib');
beforeAll(() => {
Expand All @@ -154,12 +79,9 @@ describe('Vite Plugin', () => {
packages: ['@nx/react'],
});
runCLI(`generate @nx/react:app ${app} --bundler=vite --no-interactive`);

// only this project will be directly used from dist
runCLI(
`generate @nx/react:lib ${lib}-buildable --unitTestRunner=none --bundler=vite --importPath="@acme/buildable" --no-interactive`
);

runCLI(
`generate @nx/react:lib ${lib} --unitTestRunner=none --bundler=none --importPath="@acme/non-buildable" --no-interactive`
);
Expand Down Expand Up @@ -200,37 +122,11 @@ export default App;
cleanupProject();
});

it('should build app from libs source', () => {
const results = runCLI(`build ${app} --buildLibsFromSource=true`);
it('should build app and libs too', () => {
const results = runCLI(`build ${app}`);
expect(results).toContain('Successfully ran target build for project');
// this should be more modules than build from dist
expect(results).toContain('40 modules transformed');
});

it('should build app from libs dist', () => {
const results = runCLI(`build ${app} --buildLibsFromSource=false`);
expect(results).toContain('Successfully ran target build for project');
// this should be less modules than building from source
expect(results).toContain('38 modules transformed');
});

it('should build app from libs without package.json in lib', () => {
removeFile(`libs/${lib}-buildable/package.json`);

const buildFromSourceResults = runCLI(
`build ${app} --buildLibsFromSource=true`
);
expect(buildFromSourceResults).toContain(
'Successfully ran target build for project'
);

const noBuildFromSourceResults = runCLI(
`build ${app} --buildLibsFromSource=false`
);
expect(noBuildFromSourceResults).toContain(
'Successfully ran target build for project'
);
});
});

describe('should be able to create libs that use vitest', () => {
Expand Down Expand Up @@ -302,59 +198,6 @@ export default App;
expect(directoryExists(coverageDir)).toBeTruthy();
}, 100_000);

// TODO: This takes forever and times out everything - find out why
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We are not using the @nx/vitest executor any more. so this test is not needed

xit('should not delete the project directory when coverage is enabled', async () => {
// when coverage is enabled in the vite.config.ts but reportsDirectory is removed
// from the @nx/vite:test executor options, vite will delete the project root directory
runCLI(`generate @nx/react:lib ${lib} --unitTestRunner=vitest`);
updateFile(`libs/${lib}/vite.config.ts`, () => {
return `import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';


export default defineConfig({
server: {
port: 4200,
host: 'localhost',
},
plugins: [
react(),
nxViteTsPaths()
],
test: {
globals: true,
cache: {
dir: './node_modules/.vitest',
},
environment: 'jsdom',
include: ['src/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'],
reporters: ['junit'],
outputFile: 'junit.xml',
coverage: {
enabled: true,
reportsDirectory: 'coverage',
}
},
});
`;
});
updateJson(join('libs', lib, 'project.json'), (config) => {
delete config.targets.test.options.reportsDirectory;
return config;
});

const projectRoot = `${tmpProjPath()}/libs/${lib}`;

const results = runCLI(`test ${lib}`);

expect(directoryExists(projectRoot)).toBeTruthy();
expect(results).toContain(
`Successfully ran target test for project ${lib}`
);
expect(results).toContain(`JUNIT report written`);
}, 100_000);

it('should be able to run tests with inSourceTests set to true', async () => {
runCLI(
`generate @nx/react:lib ${lib} --unitTestRunner=vitest --inSourceTests`
Expand Down