Comments (8)
These errors are fixed when I replace
http://127.0.0.1:5050/
withtcp:5050
intest:e2e
andtest:e2e:ci
scripts.
This is due to the subtle differences between 127.0.0.1
and localhost
, which is mostly fixed in Vite 3. You can read more about the technical details at https://vitejs.dev/guide/migration.html#dev-server-changes
With the proposed solution, cypress opens, but the default test fails. To fix this problem, I ran
yarn build
beforeyarn test:e2e
and it worked.
This is expected because I believe end-to-end tests should run against the production build to better match the real-world environment.
On the other hand, it is a pain point that the feedback loop would be too long with npm run build
+ npm run test:e2e
, not to say that many people forget about the build
command or forget to update the bundle in time.
So in the most recent release, I added a test:e2e:dev
command to make use of the vite dev
server.
The test:e2e
command remains as-is, though. The detailed changes are in #183
create-vue why not use playwright ?
The latest release has added a Playwright option alongside Cypress.
from create-vue.
With the proposed solution, cypress opens, but the default test fails. To fix this problem, I ran yarn build
before yarn test:e2e
and it worked.
from create-vue.
I just tried a fresh project with the same exact options, using npm init vue@3
and then npm init vue@latest
. The proposed solution doesn't change anything for me. The command just stalls like in the above screen recording:
npm run test:e2e
> [email protected] test:e2e
> start-server-and-test preview tcp:5050 'cypress open'
1: starting server using command "npm run preview"
and when url "[ 'tcp:5050' ]" is responding with HTTP status code 200
running tests using command "cypress open"
> [email protected] preview
> vite preview --port 4173
> Local: http://localhost:4173/
> Network: use `--host` to expose
And opening the localhost link in a browser, it shows Cannot GET /
.
from create-vue.
if the tests don't start, it's probably because your preview
script starts your application on port 4173 while the server you start with the start-server-and-start
command expects an app on port 5050. You need to adjust the ports to be the same.
from create-vue.
Ah I didn't realize I had to change that too, thanks. So I changed it to "preview": "vite preview --port 5050"
, and I also noticed that in cypress.config.ts
you'd (presumably) have to change it to baseUrl: 'http://localhost:5050'
?
Anyway with that, and building the app before running the test per @Tommytrg , the e2e tests worked. But I guess since it relies on building the app, that means hot-reloading with e2e wouldn't work?
Seems like something's missing here. For context, I was just playing around with create-vue because I saw that they (just recently?) started officially recommending it, but it seems odd that one of the huge functionalities of it wouldn't work out of the box. And fwiw I'm on an M1 Mac with Monterrey, a common-enough developer platform I think. Seems like I'll probably stick with Vue CLI for now until this matures more.
from create-vue.
create-vue why not use playwright ?
from create-vue.
@GreatAuk #76 has not been merged.
from create-vue.
Hi @jeremyriverain, When I adjusted the following code, it can work.
"test:e2e": "npm run build-only && start-server-and-test preview http://localhost:4173/ 'cypress open --e2e'"
from create-vue.
Related Issues (20)
- Module generates eslint config with the old commonJS syntax HOT 8
- Remove “Vue.vscode-typescript-vue-plugin” HOT 1
- Vite Plugin I Vue DevTools HOT 4
- How to set up TS configuration to use ES2021 features ? HOT 4
- regression: flags are not interpreted correctly in v3.10 when creating project HOT 2
- cannot find module using @ absolute path syntax Visual Studio Code HOT 5
- Add ESLint run-on-save VSCode settings HOT 3
- create vue project error . TypeError: (0 , import_node_util.parseArgs) is not a function HOT 5
- vue template script buggy HOT 2
- TS2307: Cannot find module '@/components/echarts' or its corresponding type declarations. HOT 8
- Add Issue templates HOT 1
- Add PR template HOT 1
- Cannot find base config file "@vue/tsconfig/tsconfig.dom.json" [tsconfig.json] HOT 14
- The e2e tests in the subfolders under e2e/ are being executed by vitest
- ESLint v9 support HOT 1
- Windows 10 bun type error HOT 1
- typescript .vue file include @types/node when include some package HOT 2
- 升级vue3小版本后 切换路由页面空白,控制台报错! HOT 2
- yarn create vue@latest report an error HOT 2
- Update README screenshot HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from create-vue.