Skip to content

Commit

Permalink
Merge pull request #171 from bible-technology/login_playwright_test
Browse files Browse the repository at this point in the history
Login page playwright test
  • Loading branch information
vipinpaul authored Oct 4, 2023
2 parents a211457 + 2724d9f commit fc600b8
Show file tree
Hide file tree
Showing 5 changed files with 91 additions and 16 deletions.
66 changes: 56 additions & 10 deletions e2e-tests/base.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

import { test, expect } from './myFixtures';
import packageInfo from '../package.json';
import { showLoginPage, checkLogInOrNot, userFile, userFolder, userJson, createUserValidation, createProjectValidation, createProjects, unstarProject, starProject } from './common';
import { showLoginPage, checkLogInOrNot, userFile, userFolder, userJson, createProjectValidation, createProjects, unstarProject, starProject, userValidation, signOut, showActiveUsers } from './common';

const fs = require('fs');
const path = require('path');
Expand Down Expand Up @@ -38,9 +38,11 @@ test('If logged IN then logout and delete that user from the backend', async ({
const folder = await userFolder(window, userName, packageInfo, path)

if (await checkLogInOrNot(window, expect)) {
await window.getByRole('button', { name: "Open user menu" }).click()
expect(await window.locator('//*[@id="user-profile"]')).toBeVisible()
await window.locator('//*[@id="user-profile"]').click()
const currentUser = await window.textContent('[aria-label="userName"]')
await window.getByRole('menuitem', { name: "Sign out" }).click()
expect(await window.locator('//*[@aria-label="signout"]')).toBeVisible()
await window.locator('//*[@aria-label="signout"]').click()
// projects page then logout and delete playwright user
if (currentUser.toLowerCase() === userName.toLowerCase() && await fs.existsSync(folder)) {
await showLoginPage(fs, folder, userName, json, file, window, expect)
Expand All @@ -57,19 +59,20 @@ test('If logged IN then logout and delete that user from the backend', async ({


test('Create a new user and login', async ({ userName }) => {
await createUserValidation(window, expect)
await window.getByPlaceholder('Username').fill(userName)
await userValidation(window, expect)
await window.locator('//input[@placeholder="Username"]').fill(userName)
await expect(window.locator('//button[@type="submit"]')).toBeVisible()
await window.click('[type=submit]');
const title = await window.textContent('[aria-label=projects]');
expect(title).toBe('Projects');
})


/*CREATE PROJECTS FOR ALL FLAVOR TYPE */
/* Translation Project */
test('Click New and Fill project page details to create a new project for text translation with custom book', async ({ textProject }) => {
await expect(window.locator('//a[@aria-label="new"]')).toBeVisible()
await window.getByRole('link', { name: 'new' }).click()
await window.locator('//a[@aria-label="new"]').click()
await createProjectValidation(window, expect)
await expect(window.locator('//input[@id="project_name"]')).toBeVisible()
await window.locator('//input[@id="project_name"]').fill(textProject)
Expand All @@ -81,8 +84,8 @@ test('Click New and Fill project page details to create a new project for text t
await window.locator('//button[@id="open-advancesettings"]').click()
await expect(window.locator('//div[@aria-label="custom-book"]')).toBeVisible()
await window.locator('//div[@aria-label="custom-book"]').click()
await window.getByLabel('nt-Matthew').click()
await window.getByRole('button', { name: 'Save' }).click()
await window.locator('//*[@aria-label="nt-Matthew"]').click()
await window.locator('//*[@id="save-canon"]').click()
await window.locator('//button[@aria-label="create"]').click()
const notifyMe = await window.textContent('//*[@id="__next"]/div/div[2]/div[2]/div/div')
expect(await notifyMe).toBe('New project created')
Expand Down Expand Up @@ -130,16 +133,59 @@ test("Unstar the audio project", async ({ audioProject }) => {
await unstarProject(window, expect, audioProject)
})

test("Sign out the Application", async () => {
await signOut(window, expect)
})

test("Click the view users button, log in with playwright user, and sign out", async ({ userName }) => {
await showActiveUsers(window, expect)
const tabContent = await window.locator('//*[@id="active-tab-content"]')
const div = await tabContent.locator("div > div")
for (let i = 0; i < await div.count(); i++) {
if (await div.nth(i).textContent() === userName.toLowerCase()) {
await div.nth(i).click()
await window.waitForTimeout(2000)
const title = await window.textContent('[aria-label=projects]')
await expect(title).toBe('Projects')
await signOut(window, expect)
}
}
})

test("Delete the user from the active tab and check in the archived tab", async ({ userName }) => {
await showActiveUsers(window, expect)
const tabContent = await window.locator('//*[@id="active-tab-content"]')
const items = await tabContent.locator('div > div')
const div = await tabContent.locator("div > button")
for (let i = 0; i < await items.count(); i++) {
if (await items.nth(i).textContent() === userName.toLowerCase()) {
await div.nth(i).click()
expect(await window.locator('//*[@id="archived-tab"]')).toBeVisible()
await window.locator('//*[@id="archived-tab"]').click()
const text = await window.locator('//*[@id="archived-tab"]').textContent()
expect(await text).toBe('Archived')
await window.getByLabel('Archived').locator('button').click()
expect(await window.locator('//*[@id="active-tab"]')).toBeVisible()
await window.locator('//*[@id="active-tab"]').click()
await window.getByRole('button', { name: userName.toLowerCase() }).click()
}
}
const title = await window.textContent('[aria-label=projects]')
await expect(title).toBe('Projects')
})

test("Logout and delete that playwright user from the backend", async ({ userName }) => {
// user json
const json = await userJson(window, packageInfo, fs, path)
// user file
const file = await userFile(window, packageInfo, path)
// user folde name
const folder = await userFolder(window, userName, packageInfo, path)
await window.getByRole('button', { name: "Open user menu" }).click()
expect(await window.locator('//*[@id="user-profile"]')).toBeVisible()
await window.locator('//*[@id="user-profile"]').click()
const currentUser = await window.textContent('[aria-label="userName"]')
await window.getByRole('menuitem', { name: "Sign out" }).click()
expect(await window.locator('//*[@aria-label="signout"]')).toBeVisible()
await window.locator('//*[@aria-label="signout"]').click()
// projects page then logout and delete playwright user
if (currentUser.toLowerCase() === userName.toLowerCase() && await fs.existsSync(folder)) {
await showLoginPage(fs, folder, userName, json, file, window, expect)
Expand Down
28 changes: 24 additions & 4 deletions e2e-tests/common.js
Original file line number Diff line number Diff line change
Expand Up @@ -51,10 +51,12 @@ export const showLoginPage = async (fs, folder, userName, json, file, window, ex
await expect(welcome).toBe("Welcome!")
await window.reload()
}
export const createUserValidation = async (window, expect) => {
await window.getByRole('button', { name: 'Create New Account' }).click()

export const userValidation = async (window, expect) => {
expect(await window.locator('//*[@aria-label="create-new-account"]')).toBeVisible()
await window.locator('//*[@aria-label="create-new-account"]').click()
await expect(window.locator('//input[@placeholder="Username"]')).toBeVisible()
await window.getByPlaceholder('Username').fill('jo')
await window.locator('//input[@placeholder="Username"]').fill('jo')
await expect(window.locator('//button[@type="submit"]')).toBeVisible()
await window.click('[type=submit]');
const lengthError = await window.locator('//*[@id="show-error"]')
Expand All @@ -74,7 +76,7 @@ export const createProjectValidation = async (window, expect) => {
/* function for creating a project for obs and audio */
export const createProjects = async (window, expect, projectname, type, description, abb) => {
await expect(window.locator('//a[@aria-label="new"]')).toBeVisible()
await window.getByRole('link', { name: 'new' }).click()
await window.locator('//a[@aria-label="new"]').click()
await expect(window.locator('//button[@aria-label="open-popover"]')).toBeVisible()
await window.locator('//button[@aria-label="open-popover"]').click()
await expect(window.locator(`//a[@data-id="${type}"]`)).toBeVisible()
Expand Down Expand Up @@ -135,4 +137,22 @@ export const unstarProject = async (window, expect, projectname) => {
}
const title = await window.textContent('[aria-label=projects]', { timeout: 10000 });
expect(title).toBe('Projects');
}

export const signOut = async (window, expect) => {
expect(await window.locator('//*[@id="user-profile"]')).toBeVisible()
await window.locator('//*[@id="user-profile"]').click()
expect(await window.locator('//*[@aria-label="signout"]')).toBeVisible()
await window.locator('//*[@aria-label="signout"]').click()
await window.waitForTimeout(1000)
const welcome = await window.textContent('//*[@id="__next"]/div/div[1]/div/h2')
await expect(welcome).toBe("Welcome!")

}

export const showActiveUsers = async (window, expect) => {
expect(await window.locator('//*[@id="view-more"]')).toBeVisible()
await window.locator('//*[@id="view-more"]').click()
const active = await window.locator('//*[@id="active-tab"]').textContent()
expect(await active).toBe("Active")
}
6 changes: 5 additions & 1 deletion renderer/src/components/Login/LeftLogin.js
Original file line number Diff line number Diff line change
Expand Up @@ -207,6 +207,7 @@ const LeftLogin = () => {
<button
type="button"
onClick={openModal}
id="view-more"
className={`
${isOpen ? '' : 'text-opacity-90'
} text-white bg-black w-48 text-xs lg:w-72 sm:w-52 py-[12px] flex items-center justify-center text-md font-bold rounded-b-[10px] sm:text-sm`}
Expand Down Expand Up @@ -247,6 +248,7 @@ const LeftLogin = () => {
<Tab.Group onChange={() => setShowArchived((value) => !value)}>
<Tab.List className="flex space-x-0 rounded-xl">
<Tab
id="active-tab"
className={({ selected }) => classNames(
'w-full text-md items-center justify-center outline-none font-bold py-4 leading-5 rounded-t-lg',
'',
Expand All @@ -258,6 +260,7 @@ const LeftLogin = () => {
Active
</Tab>
<Tab
id="archived-tab"
className={({ selected }) => classNames(
'w-full text-md items-center justify-center outline-none font-bold py-4 leading-5 rounded-t-lg',
selected
Expand All @@ -271,7 +274,7 @@ const LeftLogin = () => {
</Tab.List>
<Tab.Panels>
<Tab.Panel className="relative overflow-y-auto h-[60vh] p-5">
<div className="grid grid-cols-2">
<div className="grid grid-cols-2" id="active-tab-content">
{sortedUsers.filter(filterUsers).map((user) => (
<div className="flex items-center" key={user.username}>
<div
Expand Down Expand Up @@ -325,6 +328,7 @@ const LeftLogin = () => {
<button
onClick={openAccountModal}
type="button"
aria-label="create-new-account"
className="mt-16 mb-28 w-48 lg:w-72 sm:w-52 py-3 font-bold uppercase flex items-center text-xs justify-center text-white bg-primary rounded shadow sm:text-xs"
>
Create New Account
Expand Down
6 changes: 5 additions & 1 deletion renderer/src/components/Profile/UserProfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,9 @@ const UserProfile = () => {
{({ open }) => (
<>
<div>
<Menu.Button className="max-w-xs bg-gray-800 border-4 border-white rounded-full flex items-center text-sm
<Menu.Button
id="user-profile"
className="max-w-xs bg-gray-800 border-4 border-white rounded-full flex items-center text-sm
focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-800 focus:ring-gray-700"
>
<span className="sr-only">{t('label-user-menu')}</span>
Expand Down Expand Up @@ -97,6 +99,7 @@ const UserProfile = () => {
<Link
href="/profile"
id="profile"
aria-label="user-profile"
className={classNames(
active ? 'bg-gray-100' : '',
'block px-4 py-2 text-sm text-gray-700',
Expand All @@ -116,6 +119,7 @@ const UserProfile = () => {
<Link
href="/"
id="signout"
aria-label="signout"
onClick={() => (isElectron() ? logout() : signOut())}
role="button"
tabIndex={0}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -114,6 +114,7 @@ const CustomCanonSpecification = ({ bibleNav, closeBibleNav, handleNav }) => {
</button>
<button
type="button"
id="save-canon"
className="w-40 h-10 bg-success leading-loose rounded shadow text-xs font-base text-white tracking-wide font-light uppercase"
onClick={() => (handleNav === 'edit' ? editCanon() : saveCanon())}
>
Expand Down

0 comments on commit fc600b8

Please sign in to comment.