ci(workflow): add ci-cd-pr-web-wallet.yml

[calmcat2]

Description

There are two changes:

1. Following the README.md, add a workflow to run component and e2e tests (cypress-e2e-headless-test, cypress-component-test) whenever a pull request modifies non-Markdown files in the apps/web/** module.
2. Remove .github/github-ci.yml

Resolves: 607

---

Changes Made

• Changes in .github/workflows/ folder

---

Type of Change

• 🐛 Bug fix (non-breaking change which fixes an issue)
• ✨ New feature (non-breaking change which adds functionality)
• 💥 Breaking change (fix or feature that would cause existing
  functionality to not work as expected)
• 📝 Documentation update (changes)

---

Screenshots

The workflow has been verified in a forked repo.

---

Checklist:

• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• Any dependent changes have been merged and published in downstream modules

---

Additional Comments

The workflow requires github actions secrets. The following secrets have been added to the upstream repo.

• NEXT_PUBLIC_WALLET_APP_API
• NEXT_PUBLIC_ENV
• NEXT_PUBLIC_API_TIMEOUT
• NEXT_PUBLIC_API_RETRIES
• NEXT_PUBLIC_BASE_URL
• PRIVATE_KEYCLOAK_REALM
• PRIVATE_KEYCLOAK_BASE_URL
• PRIVATE_KEYCLOAK_CLIENT_SECRET
• DATABASE_URL
• PRIVATE_KEYCLOAK_CLIENT_ID
• PRIVATE_WALLET_API_KEY
• CORS_ORIGINS_DEV
• CORS_ORIGINS

[dadiorchen]

@calmcat2 where is the integration test? I can not find it?

Run integration test by cypress for the web app ?

[calmcat2]

@dadiorchen I followed the README Testing with Cypress section. It describes three kinds of tests: component, end-to-end (E2E), and integration, all using Cypress.

From the root package.json, it looks like there are only three relevant scripts for the web module:

• cypress-component-test: yarn workspace web run cy:component
• cypress-e2e-test: yarn workspace web cy:e2e
• cypress-e2e-headless-test: yarn workspace web cy:e2e-headless

cypress-e2e-test and cypress-e2e-headless-test appear to run the same E2E suite, just with different modes (headed vs headless), and there is no separate script explicitly named for “integration” tests.

I initially assumed the integration tests were included in cypress-e2e-headless-test, but I might be wrong. Could you please clarify which script in package.json is intended to run the web integration tests, or how integration tests are currently organized for the web app?

[dadiorchen]

I have changed the readme, e2e will be done by BDD now.

As I mentioned before, the work e2e in cypress is misleading, the command above is integration test, actually, e2e and integration is actually the way how do we write test, if we use mock API I call it integration test, in the test code you can find the mock API like this:

treetracker-wallet-app/apps/web/cypress/e2e/create-wallet.cy.ts

Lines 17 to 20 in 0b21dba

	cy.intercept("GET", "/wallets*", {
	statusCode: 200,
	body: walletData?.mocks?.initialList ?? [],
	}).as("getWallets");

So, that command is good to run for our web integration test, for you, you just make sure:

1. The component test run successfully
2. The test under /cypress/e2e/ run successfully

[calmcat2]

@dadiorchen Thanks for the clarification. I think both tests are already included in the workflow:

1. Component tests -> cypress-component-test (cy:component)
2. Tests under /cypress/e2e/ -> cypress-e2e-headless-test (cy:e2e)

Please let me know what else I need to consider.