vikunja
/
frontend
Archived
6
39
Fork 49
Code Issues 1 Pull Requests 4 Projects Releases 26 Activity

feature/feat-improve-ts-setup #1812

Merged
dpschen merged 10 commits from dpschen/frontend:feature/feat-improve-ts-setup into main 2022-07-04 21:50:50 +00:00
Conversation 7 Commits 10 Files Changed 69 +63 -5
6 changed files with 63 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 235dbb959e - Show all commits

18
cypress/plugins/index.js → cypress/plugins/index.ts
View File

@ -1,4 +1,3 @@
/// <reference types="cypress" />
// ***********************************************************
// This example plugins/index.js can be used to load plugins
//
@ -12,10 +11,21 @@
// This function is called when a project is opened or re-opened (e.g. due to
// the project's config changing)
import path from 'path'
import { startDevServer } from '@cypress/vite-dev-server'
/**
* @type {Cypress.PluginConfig}
*/
module.exports = (on, config) => {
// `on` is used to hook into various events Cypress emits
// `config` is the resolved Cypress config
export default (on, config) => {
// `on` is used to hook into various events Cypress emits
// `config` is the resolved Cypress config
on('dev-server:start', (options) => {
dpschen marked this conversation as resolved Outdated
konrad commented 2022-05-27 17:31:40 +00:00
Outdated
Review
Copy Link

Oh so this will start a dev server when starting cypress?

Oh so this will start a dev server when starting cypress?
konrad commented 2022-05-27 17:34:54 +00:00
Outdated
Review
Copy Link

I think we should document this in the cypress readme.

I think we should document this in the cypress readme.
dpschen commented 2022-05-30 10:50:36 +00:00
Outdated
Review
Copy Link

I think it waits for the server to start.

I thought I got this from the create-vue template as well. But seems like it's not from there. Searching via sourcegraph it seems I got it from some of the cypress documentation.

I think it waits for the server to start. I thought I got this from the create-vue template as well. But seems like it's not from there. [Searching via sourcegraph](https://sourcegraph.com/search?q=context:global+dev-server:start&patternType=literal) it seems I got it from some of the cypress documentation.
konrad commented 2022-06-08 19:39:58 +00:00
Outdated
Review
Copy Link

I think it would be good to know what this actually does and document it properly...

I think it would be good to know what this actually does and document it properly...
dpschen commented 2022-06-21 20:47:51 +00:00
Outdated
Review
Copy Link

Okay I think I get it now:

It's for the new component testing. We aren't doing this yet, so there is nothing to configure yet. This just enables us to do this in the future. If we do, we should document it. As of now I don't see the need, since it's just the preparation not an actual usage.

I do not grasp yet when cypress component testing makes sense for us, since if I understand it correctly goes a bit into the domain of what vitest does.

Okay I think I get it now: It's for the new component testing. We aren't doing this yet, so there is nothing to configure yet. This just enables us to do this in the future. If we do, we should document it. As of now I don't see the need, since it's just the preparation not an actual usage. I do not grasp yet when cypress component testing makes sense for us, since if I understand it correctly goes a bit into the domain of what vitest does.
👍 1
dpschen commented 2022-06-21 22:34:24 +00:00
Outdated
Review
Copy Link

Component testing in cypress 10 doesn't work via plugins anymore.
Plugins were removed, so I removed them as well.

See: ac1004f96e

and

https://docs.cypress.io/guides/references/migration-guide#Plugins-File-Removed=

Component testing in cypress 10 doesn't work via plugins anymore. Plugins were removed, so I removed them as well. See: https://kolaente.dev/vikunja/frontend/commit/ac1004f96e333070fad443e465ea9e17804f637b and https://docs.cypress.io/guides/references/migration-guide#Plugins-File-Removed=
return startDevServer({
options,
viteConfig: {
configFile: path.resolve(__dirname, '..', '..', 'vite.config.ts'),
},
})
})
}

9
cypress/plugins/tsconfig.json Normal file
View File

@ -0,0 +1,9 @@
{
"extends": "@vue/tsconfig/tsconfig.node.json",
"include": ["./**/*"],
"compilerOptions": {
"module": "CommonJS",
"preserveValueImports": false,
"types": ["node", "cypress/types/cypress"]
}
}

10
cypress/tsconfig.json Normal file
View File

@ -0,0 +1,10 @@
{
"extends": "@vue/tsconfig/tsconfig.web.json",
"include": ["./integration/**/*", "./support/**/*"],
"compilerOptions": {
"isolatedModules": false,
"target": "es5",
"lib": ["es5", "dom"],
konrad marked this conversation as resolved Outdated
konrad commented 2022-05-27 17:32:05 +00:00
Outdated
Review
Copy Link

Not es6?

Not `es6`?
dpschen commented 2022-05-30 10:46:25 +00:00
Outdated
Review
Copy Link

I took this from here: https://github.com/vuejs/create-vue-templates/blob/main/typescript-router-vitest-cypress/cypress/tsconfig.json

Not sure about the reason.

I took this from here: https://github.com/vuejs/create-vue-templates/blob/main/typescript-router-vitest-cypress/cypress/tsconfig.json Not sure about the reason.
konrad commented 2022-06-08 19:38:45 +00:00
Outdated
Review
Copy Link

Does it work with es6?

Does it work with `es6`?
dpschen commented 2022-06-21 20:32:07 +00:00
Outdated
Review
Copy Link

Tbh I don't even understand why the cypress folder needs its own tsconfig.
So I'm not really sure what implications the change to es6 would have.
Since there don't seem any problems in the test I guess keeping it as is seems fine.

Does that work for you?

Tbh I don't even understand why the cypress folder needs its own tsconfig. So I'm not really sure what implications the change to es6 would have. Since there don't seem any problems in the test I guess keeping it as is seems fine. Does that work for you?
konrad commented 2022-07-04 15:33:02 +00:00
Outdated
Review
Copy Link

Ah, didn't see this was the cypress tsconfig.

I think this is fine.

Ah, didn't see this was the cypress tsconfig. I think this is fine.
"types": ["cypress"]
}
}

1
env.d.ts vendored
View File

@ -1,2 +1,3 @@
/// <reference types="vite/client" />
/// <reference types="vite-svg-loader" />
/// <reference types="cypress" />

2
package.json
View File

@ -56,6 +56,8 @@
},
"devDependencies": {
"@4tw/cypress-drag-drop": "2.2.1",
"@cypress/vite-dev-server": "2.2.2",
"@cypress/vue": "3.1.1",
"@faker-js/faker": "7.3.0",
"@fortawesome/fontawesome-svg-core": "6.1.1",
"@fortawesome/free-regular-svg-icons": "6.1.1",

28
yarn.lock
View File

@ -1071,6 +1071,11 @@
resolved "https://registry.yarnpkg.com/@csstools/selector-specificity/-/selector-specificity-2.0.1.tgz#b6b8d81780b9a9f6459f4bfe9226ac6aefaefe87"
integrity sha512-aG20vknL4/YjQF9BSV7ts4EWm/yrjagAN7OWBNmlbEOUiu0llj4OGrFoOKK3g2vey4/p2omKCoHrWtPxSwV3HA==
"@cypress/mount-utils@1.0.2":
version "1.0.2"
resolved "https://registry.yarnpkg.com/@cypress/mount-utils/-/mount-utils-1.0.2.tgz#afbc4f8c350b7cd86edc5ad0db0cbe1e0181edc8"
integrity sha512-Fn3fdTiyayHoy8Ol0RSu4MlBH2maQ2ZEXeEVKl/zHHXEQpld5HX3vdNLhK5YLij8cLynA4DxOT/nO9iEnIiOXw==
"@cypress/request@^2.88.10":
version "2.88.10"
resolved "https://registry.yarnpkg.com/@cypress/request/-/request-2.88.10.tgz#b66d76b07f860d3a4b8d7a0604d020c662752cce"
@ -1095,6 +1100,22 @@
tunnel-agent "^0.6.0"
uuid "^8.3.2"
"@cypress/vite-dev-server@2.2.2":
version "2.2.2"
resolved "https://registry.yarnpkg.com/@cypress/vite-dev-server/-/vite-dev-server-2.2.2.tgz#dd16b7470ddd1ff095678b61c56da52ac02f44ed"
integrity sha512-02y/Fm0N+CQjKbSjjRtktPgPbp91kOvtc8+WW2l2odIYQkKlG6IOCpmgc898muW0lBAcCszdEIHR/ItdZDiYPw==
dependencies:
debug "^4.3.2"
get-port "^5.1.1"
"@cypress/vue@3.1.1":
version "3.1.1"
resolved "https://registry.yarnpkg.com/@cypress/vue/-/vue-3.1.1.tgz#0e6b4a1cb972d2f271ba05209c55e9101a96d0a4"
integrity sha512-wD1vunuPFPLC8FZtgwdq+mcSEOs27qquuJJdGcY8aAN0y38rqYuuaj+N4UxKoAjhkSwthaOeZehjBtvDvv9C6w==
dependencies:
"@cypress/mount-utils" "1.0.2"
"@vue/test-utils" "^2.0.0-rc.10"
"@cypress/xvfb@^1.2.4":
version "1.2.4"
resolved "https://registry.yarnpkg.com/@cypress/xvfb/-/xvfb-1.2.4.tgz#2daf42e8275b39f4aa53c14214e557bd14e7748a"
@ -2853,6 +2874,11 @@
resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-2.0.0-rc.18.tgz#ff22b252424fe72e5462cbb3a8e7405cef11ffb6"
integrity sha512-aifolXjVdsogjaLmDoZ0FU8vN+R67aWmg9OuVeED4w5Ij5GFQLrlhM19uhWe/r5xXUL4fXMk3pX5wW6FJP1NcQ==
"@vue/test-utils@^2.0.0-rc.10":
version "2.0.0-rc.17"
resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-2.0.0-rc.17.tgz#e6dcf5b5bd3ae23595bdb154b9b578ebcdffd698"
integrity sha512-7LHZKsFRV/HqDoMVY+cJamFzgHgsrmQFalROHC5FMWrzPzd+utG5e11krj1tVsnxYufGA2ABShX4nlcHXED+zQ==
"@vue/tsconfig@0.1.3":
version "0.1.3"
resolved "https://registry.yarnpkg.com/@vue/tsconfig/-/tsconfig-0.1.3.tgz#4a61dbd29783d01ddab504276dcf0c2b6988654f"
@ -6594,7 +6620,7 @@ get-port@^3.1.0:
resolved "https://registry.yarnpkg.com/get-port/-/get-port-3.2.0.tgz#dd7ce7de187c06c8bf353796ac71e099f0980ebc"
integrity sha1-3Xzn3hh8Bsi/NTeWrHHgmfCYDrw=
get-port@^5.1.0:
get-port@^5.1.0, get-port@^5.1.1:
version "5.1.1"
resolved "https://registry.yarnpkg.com/get-port/-/get-port-5.1.1.tgz#0469ed07563479de6efb986baf053dcd7d4e3193"
integrity sha512-g/Q1aTSDOxFpchXC4i8ZWvxA1lnPqx/JHqcpIw0/LX9T8x/GBbi6YnlN5nhaKIFkT8oFsscUKgDJYxfwfS6QsQ==