setup e2e tests with playwright #291 #292
Conversation
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
There was a problem hiding this comment.
PR Compliance Checks
Thank you for your Pull Request! We have run several checks on this pull request in order to make sure it's suitable for merging into this project. The results are listed in the following section.
Issue Reference
In order to be considered for merging, the pull request description must refer to a specific issue number. This is described in our Contributing Guide.
This check is looking for a phrase similar to: "Fixes #XYZ" or "Resolves #XYZ" where XYZ is the issue number that this PR is meant to address.
Protected Branch
In order to be considered for merging, the pull request changes must not be implemented on the "beta" branch. This is described in our Contributing Guide. We would suggest that you close this PR and implement your changes as described in our Contributing Guide and open a new pull request.
Conventional Commit PR Title
In order to be considered for merging, the pull request title must match the specification in conventional commits. You can edit the title in order for this check to pass.
Most often, our PR titles are something like one of these:
- docs: correct typo in README
- feat: implement dark mode"
- fix: correct remove button behavior
Linting Errors
- Found type "null", must be one of "feat","fix","docs","style","refactor","perf","test","build","ci","chore","revert"
- No subject found
|
Thanks for the PR, I really appreciate that and the time you took to solve the issue, I just have some comments, could you follow the PR template and the compliance check? to do that you will need to have a new PR from a different branch. Then the other things could be resolved easily. why to do that? because it will help to connect the issue with the PRs and have an easy to review approach for the future. |
| await page.fill("#login_field", "username"); | ||
| await page.fill("#password", "password"); | ||
|
|
There was a problem hiding this comment.
I think we could use the .env here though.
| reporter: 'html', | ||
| /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ | ||
| use: { | ||
| /* Base URL to use in actions like `await page.goto('/')`. */ | ||
| // baseURL: 'http://127.0.0.1:3000', | ||
| testDir: "./e2e/tests", | ||
| /* Run tests in files in parallel */ | ||
| fullyParallel: true, | ||
| /* Fail the build on CI if you accidentally left test.only in the source code. */ | ||
| forbidOnly: !!process.env.CI, | ||
| /* Retry on CI only */ | ||
| retries: process.env.CI ? 2 : 0, | ||
| /* Opt out of parallel tests on CI. */ | ||
| workers: process.env.CI ? 1 : undefined, | ||
| /* Reporter to use. See https://playwright.dev/docs/test-reporters */ | ||
| reporter: "html", |
There was a problem hiding this comment.
This change is due to the different linting we have. Before doing the next PR if you could have an "npm run format" it would be appreciated.
There was a problem hiding this comment.
I did run this locally, and it seems to work good as for initial try.
I think if we do this, the PR would be approved.
My only concern right now is that we are not testing the login, since the cookies is injected already the extension behave like we already logged in, I think we could ignore this right now.
| await page.getByRole('button', {name: 'Login'}).click(); | ||
|
|
||
| const authPage = await context.waitForEvent('page'); | ||
| await authPage.waitForURL('https://beta.app.opensauced.pizza/feed'); | ||
| await authPage.close(); | ||
|
|
||
| await page.reload(); | ||
| await expect(page.getByAltText( "OpenSauced logo")).toBeVisible(); |
There was a problem hiding this comment.
As for this, since the extension is getting the cookies, then it seems to be already logged in, getting the highlights and seeing them as working would be a great approach.
| await page.getByRole('button', {name: 'Login'}).click(); | |
| const authPage = await context.waitForEvent('page'); | |
| await authPage.waitForURL('https://beta.app.opensauced.pizza/feed'); | |
| await authPage.close(); | |
| await page.reload(); | |
| await expect(page.getByAltText( "OpenSauced logo")).toBeVisible(); | |
| await expect(page.getByRole('link', { name: 'Highlights feed' })).toBeVisible(); |
| @@ -0,0 +1,36 @@ | |||
| import { test as base, chromium, type BrowserContext } from "@playwright/test"; | |||
| import path from "path"; | |||
| const auth = require("../auth/auth.json"); | |||
There was a problem hiding this comment.
| const auth = require("../auth/auth.json"); | |
| const auth = require(path.resolve(__dirname, "..", "auth", "auth.json")); |
|
Thanks everyone for looking into this. Before we go further, we need a test database set up to run these end to end tests against. We do not want to be adding test data to the production database, e.g. adding test highlights. I have a discussion going on internally (for the moment) for the app repository end to end test setup for the same thing. |
|
@nickytonline thank you for that information, I think we could get the setup ready first then check the highlights, right now we are not there yet. Right now we are just checking the highlights if they are there or not and checking if this works, we did not apply anything that adds highlights yet. |
This pull request aims to establish the test environment for end-to-end testing of the Open-Sauced extension. It involves setting up end-to-end tests using Playwright, #291.
The addCookies function was utilized instead of directly employing storageState because the PersistentContext module does not currently support the direct loading of storageState.