Skip to content

Add vite support - #434

Open
SergeAstapov wants to merge 1 commit into
ember-cli-code-coverage:masterfrom
SergeAstapov:master
Open

Add vite support#434
SergeAstapov wants to merge 1 commit into
ember-cli-code-coverage:masterfrom
SergeAstapov:master

Conversation

@SergeAstapov

Copy link
Copy Markdown
Contributor

Closes #431.

This is pretty large PR because:

  1. addon needs restructuring, to make architecture modular.
  2. added my-vite-addon test package
  3. added my-vite-app test package
  4. updated documentation

The other way I can make this small and potentially easier to review (if anyone wants to do thorough code review):

  1. have one PR that does restructuring, to make architecture modular.
  2. then introduce Vite support

@@ -0,0 +1,48 @@
'use strict';

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

this file prepares for template coverage, to showcase how it would fit into new architecture to make these changes compatible with #433

Comment thread .github/workflows/ci.yml
- uses: actions/checkout@v4
- name: Install Node
uses: actions/setup-node@v3
uses: actions/setup-node@v4

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

Suggested change
uses: actions/setup-node@v4
uses: actions/setup-node@v6

Comment thread .github/workflows/ci.yml
@@ -20,12 +20,12 @@ jobs:
steps:
- uses: actions/checkout@v4

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

Suggested change
- uses: actions/checkout@v4
- uses: actions/checkout@v6

@kategengler kategengler left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

I've started reviewing but will need to continue later.

I'd be okay with dropping support for the old style (telling users in the README to use a particular major).

I also think it would be helpful to explain how the project differs from https://github.com/NullVoxPopuli/testem-code-coverage for vite-based projects.

Comment thread README.md

### v2 Embroider addons (Rollup-based)

For v2 Embroider native addons based on https://github.com/embroider-build/addon-blueprint blueprint:

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

This is not the eventual blueprint. That can be found https://github.com/ember-cli/ember-addon-blueprint

I'd prefer to have compatibility with the official blueprint.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

we do have compatibility with ember-addon-blueprint, it's under Vite support.

this one is for that previous blueprint where we did have support for some time, but readme just didn't explain how to do it.

at minimum we can swap it with Vite docs to make Vite more prominent. not sure it worth to completely remove this section

Comment thread README.md
[Classic Ember CLI apps](#classic-ember-cli-apps) or
[Vite-based apps and addons](#vite-based-apps-and-addons) sections.

### Vite-based apps and addons

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

We should bump this ahead of the the other instructions since it is the current default for apps and will soon be so for addons

Comment thread README.md

This matches the [ember-addon-blueprint vite.config.mjs](https://github.com/ember-cli/ember-addon-blueprint/blob/main/files/vite.config.mjs):

```js

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

Can we do these examples as diffs so it is easy to see what needs to be added for the addon vs what is already there?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

was thinking the same - will update all examples!

Comment thread README.md
plugins: [
...(isCompat ? [classicEmberSupport()] : []),
ember(),
...(enableCoverage ? coveragePlugin() : []),

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

Looks like coverageEnvVar is irrelevant for vite projects, then?

Comment thread README.md
#### Test helper (`tests/test-helper.js` or `tests/test-helper.ts`)

Instrumentation records hits in `window.__coverage__`, but reports are only written after the browser **POSTs** that payload to `/write-coverage`.
Wire that up from [`ember-cli-code-coverage/test-support`](https://github.com/ember-cli-code-coverage/ember-cli-code-coverage/tree/master/packages/ember-cli-code-coverage/addon-test-support) in **`tests/test-helper.js`** or **`tests/test-helper.ts`** (same pattern for either extension).

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

This line is confusing -- the demonstration of the use of it below is enough.

Comment thread README.md
}
```

If you use **`vite build` + Testem** (output to `dist-tests` or `dist`), the Vite dev server's `configureServer` hook from `coveragePlugin()` only runs under **`vite dev`**, not during a production-style test build. For this case the addon automatically detects `@embroider/vite` in your project's `package.json` and registers `createViteTestemMiddleware()` for you via its `testemMiddleware` hook — no extra `testem.cjs` configuration is required.

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

This needs some clarification

Comment thread README.md
## TypeScript integration
## TypeScript integration (classic ember-cli / Embroider)

For Vite-based projects, TypeScript is handled natively by Vite/esbuild — no

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

Lots of implementation details have leaked into these user-facing docs

Comment thread README.md

* in `ember-cli-build.js
```
* in `ember-cli-build.js`

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

Is this section still relevant?

Comment thread README.md
};
```

## Migration from v2 to v3

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

Not sure this belongs in the README, more like a changelog entry

@mcfiredrill

Copy link
Copy Markdown

Was wondering if forceModulesToBeLoaded will need to be rewritten to work with vite, or will this function not be needed any more in vite?
https://github.com/ember-cli-code-coverage/ember-cli-code-coverage/blob/master/packages/ember-cli-code-coverage/addon-test-support/index.js#L22C17-L22C39

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add vite support ... ?

3 participants