Skip to content

Commit

Permalink
Titlecase naming
Browse files Browse the repository at this point in the history
  • Loading branch information
@RoyalIcing
RoyalIcing committed Jan 30, 2024
1 parent 8c6f321 commit 0a73002
Show file tree
Hide file tree
Showing 13 changed files with 68 additions and 64 deletions.
6 changes: 5 additions & 1 deletion src/roles/all.ts
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,8 @@
export * from './tabs';
export * from './button';
export * from './checkbox';
export * from './tabs';
export * from './textbox';
export * from './listbox';
export * from './combobox';
export * from './search';
export * from './menu';
42 changes: 21 additions & 21 deletions src/roles/calendar.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { Calendar } from './calendar';
import { prettyDOM, render } from '@testing-library/react';
import user from '@testing-library/user-event';
import '@testing-library/jest-dom';
import { CalendarSpectrum } from './Calendar-spectrum';
import { CalendarSpectrum } from './calendar-spectrum';
import { screenTest } from '../screen';

function freshFn() {
Expand All @@ -22,50 +22,50 @@ describe('Calendar', () => {
});

it('has previous button', () => {
expect(screenTest(Calendar.previousButton())).toBeVisible();
expect(screenTest(Calendar.PreviousButton())).toBeVisible();
});

it('can click previous button', async () => {
await screenTest.wait(Calendar.previousButton().click);
await screenTest.wait(Calendar.PreviousButton().click);
expect(
await screenTest.wait(Calendar.grid('Audition Date, January 2020'))
await screenTest.wait(Calendar.Grid('Audition Date, January 2020'))
).toBeVisible();
});

it('has next button', () => {
// Spectrum has two Next button, one for the next month, one for tabbing.
expect(screenTest(Calendar.nextButton().all)[0]).toBeVisible();
expect(screenTest(Calendar.NextButton().all)[0]).toBeVisible();
});

it('has grid', () => {
expect(screenTest(Calendar.grid())).toBeVisible();
expect(screenTest(Calendar.Grid())).toBeVisible();
});

it('has named grid', () => {
expect(
screenTest(Calendar.grid('Audition Date, February 2020'))
screenTest(Calendar.Grid('Audition Date, February 2020'))
).toBeVisible();
});

it('has week rows', () => {
expect(screenTest(Calendar.weekRow().all)).toHaveLength(5);
expect(screenTest(Calendar.WeekRow().all)).toHaveLength(5);
});

it('has day gridcells', () => {
expect(screenTest(Calendar.dayGridCell().all)).toHaveLength(5 * 7);
expect(screenTest(Calendar.DayGridCell().all)).toHaveLength(5 * 7);
});

it('has selected day gridcell', () => {
const selectedDay = screenTest(Calendar.dayGridCell().selected);
const selectedDay = screenTest(Calendar.DayGridCell().selected);
expect(
screenTest(Calendar.dayButton(/February 3, 2020/), selectedDay)
screenTest(Calendar.DayButton(/February 3, 2020/), selectedDay)
).toBeVisible();
});

describe.skip('when particular day is clicked', () => {
beforeEach(async () => {
console.log(prettyDOM(screenTest(Calendar.grid())));
await screenTest.wait(Calendar.dayButton('20 February 2020').click);
console.log(prettyDOM(screenTest(Calendar.Grid())));
await screenTest.wait(Calendar.DayButton('20 February 2020').click);
});

it('dispatches', () => {
Expand All @@ -81,43 +81,43 @@ describe('Calendar', () => {
});

it('focuses on selected day', () => {
const selectedDay = screenTest(Calendar.dayGridCell().selected);
expect(screenTest(Calendar.dayButton(), selectedDay)).toHaveFocus();
const selectedDay = screenTest(Calendar.DayGridCell().selected);
expect(screenTest(Calendar.DayButton(), selectedDay)).toHaveFocus();
});

it('can go left', async () => {
await user.keyboard('{ArrowLeft}');
expect(
screenTest(Calendar.dayButton(/February 2, 2020/))
screenTest(Calendar.DayButton(/February 2, 2020/))
).toHaveFocus();
});

it('can go right', async () => {
await user.keyboard('{ArrowRight}');
expect(
screenTest(Calendar.dayButton(/February 4, 2020/))
screenTest(Calendar.DayButton(/February 4, 2020/))
).toHaveFocus();
});

it('can select left with Enter key', async () => {
await user.keyboard('{ArrowLeft}{Enter}');
const selectedDay = screenTest(Calendar.dayGridCell().selected);
const selectedDay = screenTest(Calendar.DayGridCell().selected);
expect(
screenTest(Calendar.dayButton(/February 2, 2020/), selectedDay)
screenTest(Calendar.DayButton(/February 2, 2020/), selectedDay)
).toHaveFocus();
});

it('can select right with Enter key', async () => {
await user.keyboard('{ArrowRight}{Enter}');
expect(
screenTest(Calendar.dayButton(/February 4, 2020/))
screenTest(Calendar.DayButton(/February 4, 2020/))
).toHaveFocus();
});

it('focuses next week after pressing right arrow 7 times', async () => {
await user.keyboard(new Array(7).fill('{ArrowRight}').join(''));
expect(
screenTest(Calendar.dayButton(/February 10, 2020/))
screenTest(Calendar.DayButton(/February 10, 2020/))
).toHaveFocus();
});
});
Expand Down
12 changes: 6 additions & 6 deletions src/roles/calendar.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,22 +3,22 @@ import { role, roleSelectable } from './shared';
export const Calendar = Object.assign(
{},
{
previousButton(name: string | RegExp = /previous/i) {
PreviousButton(name: string | RegExp = /previous/i) {
return role<{ click: true }>('button', name);
},
nextButton(name: string | RegExp = /next/i) {
NextButton(name: string | RegExp = /next/i) {
return role<{ click: true }>('button', name);
},
grid(name?: string | RegExp) {
Grid(name?: string | RegExp) {
return role('grid', name);
},
weekRow(name?: string | RegExp) {
WeekRow(name?: string | RegExp) {
return role('row', name);
},
dayGridCell(name?: string | RegExp) {
DayGridCell(name?: string | RegExp) {
return roleSelectable('gridcell', name);
},
dayButton(name?: string | RegExp) {
DayButton(name?: string | RegExp) {
return role<{ click: true }>('button', name);
},
}
Expand Down
32 changes: 16 additions & 16 deletions src/roles/combobox.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import { Combobox } from './combobox';
import { ComboboxSpectrum } from './combobox-spectrum';

describe('Combobox', () => {
describe.each([['<ComboboxHeadlessUI>', <ComboboxHeadlessUI />]])(
describe.each([['@headlessui/react', <ComboboxHeadlessUI />]])(
'%s',
(_displayName, el) => {
beforeEach(() => {
Expand Down Expand Up @@ -36,31 +36,31 @@ describe('Combobox', () => {
test('tabThenDownArrow', async () => {
await Combobox.Interactions(user).tabThenDownArrow();
waitFor(() => {
expect(screenTest(Combobox.popupListbox())).toBeVisible();
expect(screenTest(Combobox.PopupListbox())).toBeVisible();
});
});

test('tabThenDownArrow + escape', async () => {
await Combobox.Interactions(user).tabThenDownArrow();
await Combobox.Interactions(user).escape();
expect(screenTest(Combobox.popupListbox.all)).toHaveLength(0);
expect(screenTest(Combobox.PopupListbox.all)).toHaveLength(0);
});
});

describe('when user tabs and presses the down arrow', () => {
beforeEach(() => user.keyboard('{Tab}{Down}'));

it('renders listbox', () => {
expect(screenTest(Combobox.popupListbox())).toBeVisible();
expect(screenTest(Combobox.PopupListbox())).toBeVisible();
});

it('renders 1 listbox', () => {
expect(screenTest(Combobox.popupListbox.all)).toHaveLength(1);
expect(screenTest(Combobox.PopupListbox.all)).toHaveLength(1);
});

it('has 5 options', async () => {
await waitFor(() => {
expect(screenTest(Combobox.popupListbox.option().all)).toHaveLength(
expect(screenTest(Combobox.PopupListbox.Option().all)).toHaveLength(
5
);
});
Expand All @@ -85,47 +85,47 @@ describe('Combobox', () => {
});

describe('Combobox.Button', () => {
describe.each([['<ComboboxSpectrum>', <ComboboxSpectrum />]])(
describe.each([['@adobe/react-spectrum', <ComboboxSpectrum />]])(
'%s',
(_displayName, el) => {
beforeEach(() => {
render(el);
});

it('renders button', () => {
expect(screenTest(Combobox.button())).toBeVisible();
expect(screenTest(Combobox.Button())).toBeVisible();
});

it('renders named button', () => {
expect(
screenTest(Combobox.button('Person Durward Reynolds'))
screenTest(Combobox.Button('Person Durward Reynolds'))
).toBeVisible();
});

it('has selected person as name', () => {
expect(screenTest(Combobox.button())).toHaveAccessibleName(
expect(screenTest(Combobox.Button())).toHaveAccessibleName(
expect.stringContaining('Durward Reynolds')
);
});

describe('.Interactions', () => {
test('tab', async () => {
await Combobox.Interactions(user).tab();
expect(screenTest(Combobox.button())).toHaveFocus();
expect(screenTest(Combobox.Button())).toHaveFocus();
});

test.skip('tabThenDownArrow', async () => {
await Combobox.Interactions(user).tabThenDownArrow();
await waitFor(() => {
expect(screenTest(Combobox.popupListbox())).toBeVisible();
expect(screenTest(Combobox.PopupListbox())).toBeVisible();
});
});

test('tabThenDownArrow + escape', async () => {
await Combobox.Interactions(user).tabThenDownArrow();
await Combobox.Interactions(user).escape();
waitFor(() => {
expect(screenTest(Combobox.popupListbox.all)).toHaveLength(0);
expect(screenTest(Combobox.PopupListbox.all)).toHaveLength(0);
});
});
});
Expand All @@ -134,16 +134,16 @@ describe('Combobox.Button', () => {
beforeEach(() => user.keyboard('{Tab}{Down}'));

it('renders listbox', () => {
expect(screenTest(Combobox.popupListbox())).toBeVisible();
expect(screenTest(Combobox.PopupListbox())).toBeVisible();
});

it('renders 1 listbox', () => {
expect(screenTest(Combobox.popupListbox.all)).toHaveLength(1);
expect(screenTest(Combobox.PopupListbox.all)).toHaveLength(1);
});

it('has 5 options', async () => {
await waitFor(() => {
expect(screenTest(Combobox.popupListbox.option().all)).toHaveLength(
expect(screenTest(Combobox.PopupListbox.Option().all)).toHaveLength(
5
);
});
Expand Down
4 changes: 2 additions & 2 deletions src/roles/combobox.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,10 +15,10 @@ export const Combobox = Object.assign(combobox, {
get all() {
return role('combobox').all;
},
get popupListbox() {
get PopupListbox() {
return Listbox;
},
get button() {
get Button() {
return Button;
},
// TODO: or Scripts()?
Expand Down
6 changes: 3 additions & 3 deletions src/roles/listbox.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,14 +18,14 @@ describe('Listbox', () => {
});

it('renders button', () => {
expect(screenTest(Button(/^Choose/))).toBeVisible();
expect(screenTest(Button(/\bChoose\b/))).toBeVisible();
});

describe('when opening', () => {
// screenTest.click(Button(/^Choose/))
// screenTest.user.clicks(Button(/^Choose/))
// screenTest._clicks_(Button(/^Choose/))
beforeEach(() => user.click(screenTest(Button(/^Choose/))));
beforeEach(() => user.click(screenTest(Button(/\bChoose\b/))));

it('renders labelled listbox', () => {
expect(screenTest(Listbox('Choose'))).toBeVisible();
Expand All @@ -38,7 +38,7 @@ describe('Listbox', () => {
it.skip('has 3 options', async () => {
// const el = screenTest(Listbox());
await waitFor(() => {
expect(screenTest(Listbox.option().all)).toHaveLength(3);
expect(screenTest(Listbox.Option().all)).toHaveLength(3);
});
});
});
Expand Down
2 changes: 1 addition & 1 deletion src/roles/listbox.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ export const Listbox = Object.assign(listbox, {
get all() {
return role('listbox').all;
},
option(name?: string | RegExp) {
Option(name?: string | RegExp) {
return roleSelectable('option', name);
},
});
10 changes: 5 additions & 5 deletions src/roles/menu.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,19 +34,19 @@ describe('Menu', () => {
});

it('renders 3 menu items', () => {
expect(screenTest(Menu.item().all)).toHaveLength(3);
expect(screenTest(Menu.Item().all)).toHaveLength(3);
});

it('renders 3 menu items: Cut, Copy, Paste', () => {
const [first, second, third] = screenTest(Menu.item().all);
const [first, second, third] = screenTest(Menu.Item().all);
expect(first).toHaveAccessibleName('Cut');
expect(second).toHaveAccessibleName('Copy');
expect(third).toHaveAccessibleName('Paste');
});

describe('when clicking on Cut item', () => {
beforeEach(async () => {
await user.click(screenTest(Menu.item('Cut')));
await user.click(screenTest(Menu.Item('Cut')));
});

it('calls select with cut', () => {
Expand All @@ -56,7 +56,7 @@ describe('Menu', () => {

describe('when clicking on Copy item', () => {
beforeEach(async () => {
await user.click(screenTest(Menu.item('Copy')));
await user.click(screenTest(Menu.Item('Copy')));
});

it('calls select with copy', () => {
Expand All @@ -66,7 +66,7 @@ describe('Menu', () => {

describe('when clicking on Paste item', () => {
beforeEach(async () => {
await user.click(screenTest(Menu.item('Paste')));
await user.click(screenTest(Menu.Item('Paste')));
});

it('calls select with paste', () => {
Expand Down
2 changes: 1 addition & 1 deletion src/roles/menu.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ export const Menu = Object.assign(
get all() {
return role('menu').all;
},
item(name?: string | RegExp) {
Item(name?: string | RegExp) {
return role('menuitem', name);
},
}
Expand Down
2 changes: 1 addition & 1 deletion src/roles/search.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ describe('Checkbox', () => {
});

it('has search box', () => {
expect(screenTest(Search.box())).toBeVisible();
expect(screenTest(Search.Box())).toBeVisible();
});

describe('when user submit search', () => {
Expand Down
2 changes: 1 addition & 1 deletion src/roles/search.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ export const Search = Object.assign(
get all() {
return role('search').all;
},
box(name?: string | RegExp) {
Box(name?: string | RegExp) {
return role('searchbox', name);
},
}
Expand Down
Loading

0 comments on commit 0a73002

Please sign in to comment.