Skip to content

Commit

Permalink
Update tests for user-event changes
Browse files Browse the repository at this point in the history
  • Loading branch information
@devongovett
devongovett committed Sep 13, 2023
1 parent 087f1bf commit ca4e5eb
Show file tree
Hide file tree
Showing 8 changed files with 59 additions and 59 deletions.
8 changes: 4 additions & 4 deletions packages/@react-spectrum/list/test/ListView.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1542,7 +1542,7 @@ describe('ListView', function () {
expect(onClick.mock.calls[0][0].target.href).toBe('https://google.com/');
});

it.each(['single', 'multiple'])('should support links with selectionStyle="checkbox" selectionMode="%s"', function (selectionMode) {
it.each(['single', 'multiple'])('should support links with selectionStyle="checkbox" selectionMode="%s"', async function (selectionMode) {
let {getAllByRole} = render(
<Provider theme={theme}>
<ListView aria-label="listview" selectionMode={selectionMode}>
Expand All @@ -1565,7 +1565,7 @@ describe('ListView', function () {
expect(onClick.mock.calls[0][0].target).toBeInstanceOf(HTMLAnchorElement);
expect(onClick.mock.calls[0][0].target.href).toBe('https://google.com/');

userEvent.click(within(items[0]).getByRole('checkbox'));
await user.click(within(items[0]).getByRole('checkbox'));
expect(items[0]).toHaveAttribute('aria-selected', 'true');

onClick = jest.fn();
Expand All @@ -1576,7 +1576,7 @@ describe('ListView', function () {
window.removeEventListener('click', onClick);
});

it.each(['single', 'multiple'])('should support links with selectionStyle="highlight" selectionMode="%s"', function (selectionMode) {
it.each(['single', 'multiple'])('should support links with selectionStyle="highlight" selectionMode="%s"', async function (selectionMode) {
let {getAllByRole} = render(
<Provider theme={theme}>
<ListView aria-label="listview" selectionMode={selectionMode} selectionStyle="highlight">
Expand Down Expand Up @@ -1607,7 +1607,7 @@ describe('ListView', function () {
onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
if (type === 'mouse') {
userEvent.dblClick(items[0], {pointerType: 'mouse'});
await user.dblClick(items[0], {pointerType: 'mouse'});
} else {
fireEvent.keyDown(items[0], {key: 'Enter'});
fireEvent.keyUp(items[0], {key: 'Enter'});
Expand Down
22 changes: 11 additions & 11 deletions packages/@react-spectrum/table/test/Table.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4633,16 +4633,16 @@ export let tableTests = () => {

describe('links', function () {
describe.each(['mouse', 'keyboard'])('%s', (type) => {
let trigger = (item, key = 'Enter') => {
let trigger = async (item, key = 'Enter') => {
if (type === 'mouse') {
triggerPress(item);
await user.click(item);
} else {
fireEvent.keyDown(item, {key});
fireEvent.keyUp(item, {key});
}
};

it('should support links with selectionMode="none"', function () {
it('should support links with selectionMode="none"', async function () {
let {getAllByRole} = render(
<Provider theme={theme}>
<TableView aria-label="Table">
Expand Down Expand Up @@ -4675,13 +4675,13 @@ export let tableTests = () => {

let onClick = jest.fn().mockImplementation(e => e.preventDefault());
window.addEventListener('click', onClick, {once: true});
trigger(items[0]);
await trigger(items[0]);
expect(onClick).toHaveBeenCalledTimes(1);
expect(onClick.mock.calls[0][0].target).toBeInstanceOf(HTMLAnchorElement);
expect(onClick.mock.calls[0][0].target.href).toBe('https://google.com/');
});

it.each(['single', 'multiple'])('should support links with selectionStyle="checkbox" selectionMode="%s"', function (selectionMode) {
it.each(['single', 'multiple'])('should support links with selectionStyle="checkbox" selectionMode="%s"', async function (selectionMode) {
let {getAllByRole} = render(
<Provider theme={theme}>
<TableView aria-label="Table" selectionMode={selectionMode}>
Expand Down Expand Up @@ -4714,23 +4714,23 @@ export let tableTests = () => {

let onClick = jest.fn().mockImplementation(e => e.preventDefault());
window.addEventListener('click', onClick, {once: true});
trigger(items[0]);
await trigger(items[0]);
expect(onClick).toHaveBeenCalledTimes(1);
expect(onClick.mock.calls[0][0].target).toBeInstanceOf(HTMLAnchorElement);
expect(onClick.mock.calls[0][0].target.href).toBe('https://google.com/');

userEvent.click(within(items[0]).getByRole('checkbox'));
await user.click(within(items[0]).getByRole('checkbox'));
expect(items[0]).toHaveAttribute('aria-selected', 'true');

onClick = jest.fn().mockImplementation(e => e.preventDefault());
window.addEventListener('click', onClick);
trigger(items[1], ' ');
await trigger(items[1], ' ');
expect(onClick).not.toHaveBeenCalled();
expect(items[1]).toHaveAttribute('aria-selected', 'true');
document.removeEventListener('click', onClick);
});

it.each(['single', 'multiple'])('should support links with selectionStyle="highlight" selectionMode="%s"', function (selectionMode) {
it.each(['single', 'multiple'])('should support links with selectionStyle="highlight" selectionMode="%s"', async function (selectionMode) {
let {getAllByRole} = render(
<Provider theme={theme}>
<TableView aria-label="Table" selectionMode={selectionMode} selectionStyle="highlight">
Expand Down Expand Up @@ -4763,15 +4763,15 @@ export let tableTests = () => {

let onClick = jest.fn().mockImplementation(e => e.preventDefault());
window.addEventListener('click', onClick);
trigger(items[0], ' ');
await trigger(items[0], ' ');
expect(onClick).not.toHaveBeenCalled();
expect(items[0]).toHaveAttribute('aria-selected', 'true');
document.removeEventListener('click', onClick);

onClick = jest.fn().mockImplementation(e => e.preventDefault());
window.addEventListener('click', onClick, {once: true});
if (type === 'mouse') {
userEvent.dblClick(items[0], {pointerType: 'mouse'});
await user.dblClick(items[0], {pointerType: 'mouse'});
} else {
fireEvent.keyDown(items[0], {key: 'Enter'});
fireEvent.keyUp(items[0], {key: 'Enter'});
Expand Down
22 changes: 11 additions & 11 deletions packages/react-aria-components/test/GridList.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -342,16 +342,16 @@ describe('GridList', () => {

describe('links', function () {
describe.each(['mouse', 'keyboard'])('%s', (type) => {
let trigger = (item, key = 'Enter') => {
let trigger = async (item, key = 'Enter') => {
if (type === 'mouse') {
userEvent.click(item);
await user.click(item);
} else {
fireEvent.keyDown(item, {key});
fireEvent.keyUp(item, {key});
}
};

it('should support links with selectionMode="none"', function () {
it('should support links with selectionMode="none"', async function () {
let {getAllByRole} = render(
<GridList aria-label="listview">
<Item href="https://google.com">One</Item>
Expand All @@ -367,13 +367,13 @@ describe('GridList', () => {

let onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
trigger(items[0]);
await trigger(items[0]);
expect(onClick).toHaveBeenCalledTimes(1);
expect(onClick.mock.calls[0][0].target).toBeInstanceOf(HTMLAnchorElement);
expect(onClick.mock.calls[0][0].target.href).toBe('https://google.com/');
});

it.each(['single', 'multiple'])('should support links with selectionBehavior="toggle" selectionMode="%s"', function (selectionMode) {
it.each(['single', 'multiple'])('should support links with selectionBehavior="toggle" selectionMode="%s"', async function (selectionMode) {
let {getAllByRole} = render(
<GridList aria-label="listview" selectionMode={selectionMode}>
<Item href="https://google.com" textValue="one"><Checkbox slot="selection" /> One</Item>
Expand All @@ -389,22 +389,22 @@ describe('GridList', () => {

let onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
trigger(items[0]);
await trigger(items[0]);
expect(onClick).toHaveBeenCalledTimes(1);
expect(onClick.mock.calls[0][0].target).toBeInstanceOf(HTMLAnchorElement);
expect(onClick.mock.calls[0][0].target.href).toBe('https://google.com/');

userEvent.click(within(items[0]).getByRole('checkbox'));
await user.click(within(items[0]).getByRole('checkbox'));
expect(items[0]).toHaveAttribute('aria-selected', 'true');

onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
trigger(items[1], ' ');
await trigger(items[1], ' ');
expect(onClick).not.toHaveBeenCalled();
expect(items[1]).toHaveAttribute('aria-selected', 'true');
});

it.each(['single', 'multiple'])('should support links with selectionBehavior="replace" selectionMode="%s"', function (selectionMode) {
it.each(['single', 'multiple'])('should support links with selectionBehavior="replace" selectionMode="%s"', async function (selectionMode) {
let {getAllByRole} = render(
<GridList aria-label="listview" selectionMode={selectionMode} selectionBehavior="replace">
<Item href="https://google.com">One</Item>
Expand All @@ -421,7 +421,7 @@ describe('GridList', () => {
let onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
if (type === 'mouse') {
userEvent.click(items[0]);
await user.click(items[0]);
} else {
fireEvent.keyDown(items[0], {key: ' '});
fireEvent.keyUp(items[0], {key: ' '});
Expand All @@ -432,7 +432,7 @@ describe('GridList', () => {
onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
if (type === 'mouse') {
userEvent.dblClick(items[0], {pointerType: 'mouse'});
await user.dblClick(items[0], {pointerType: 'mouse'});
} else {
fireEvent.keyDown(items[0], {key: 'Enter'});
fireEvent.keyUp(items[0], {key: 'Enter'});
Expand Down
20 changes: 10 additions & 10 deletions packages/react-aria-components/test/ListBox.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -645,16 +645,16 @@ describe('ListBox', () => {

describe('links', function () {
describe.each(['mouse', 'keyboard'])('%s', (type) => {
let trigger = (item) => {
let trigger = async (item) => {
if (type === 'mouse') {
userEvent.click(item);
await user.click(item);
} else {
fireEvent.keyDown(item, {key: 'Enter'});
fireEvent.keyUp(item, {key: 'Enter'});
}
};

it('should support links with selectionMode="none"', function () {
it('should support links with selectionMode="none"', async function () {
let {getAllByRole} = render(
<ListBox aria-label="listbox">
<Item href="https://google.com">One</Item>
Expand All @@ -670,13 +670,13 @@ describe('ListBox', () => {

let onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
trigger(items[0]);
await trigger(items[0]);
expect(onClick).toHaveBeenCalledTimes(1);
expect(onClick.mock.calls[0][0].target).toBeInstanceOf(HTMLAnchorElement);
expect(onClick.mock.calls[0][0].target.href).toBe('https://google.com/');
});

it.each(['single', 'multiple'])('should support links with selectionMode="%s"', function (selectionMode) {
it.each(['single', 'multiple'])('should support links with selectionMode="%s"', async function (selectionMode) {
let {getAllByRole} = render(
<ListBox aria-label="listbox" selectionMode={selectionMode}>
<Item href="https://google.com">One</Item>
Expand All @@ -692,22 +692,22 @@ describe('ListBox', () => {

let onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
trigger(items[0]);
await trigger(items[0]);
expect(onClick).toHaveBeenCalledTimes(1);
expect(onClick.mock.calls[0][0].target).toBeInstanceOf(HTMLAnchorElement);
expect(onClick.mock.calls[0][0].target.href).toBe('https://google.com/');
expect(items[0]).not.toHaveAttribute('aria-selected', 'true');

onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
trigger(items[1]);
await trigger(items[1]);
expect(onClick).toHaveBeenCalledTimes(1);
expect(onClick.mock.calls[0][0].target).toBeInstanceOf(HTMLAnchorElement);
expect(onClick.mock.calls[0][0].target.href).toBe('https://adobe.com/');
expect(items[1]).not.toHaveAttribute('aria-selected', 'true');
});

it.each(['single', 'multiple'])('should support links with selectionMode="%s" selectionBehavior="replace"', function (selectionMode) {
it.each(['single', 'multiple'])('should support links with selectionMode="%s" selectionBehavior="replace"', async function (selectionMode) {
let {getAllByRole} = render(
<ListBox aria-label="listbox" selectionMode={selectionMode} selectionBehavior="replace">
<Item href="https://google.com">One</Item>
Expand All @@ -724,7 +724,7 @@ describe('ListBox', () => {
let onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
if (type === 'mouse') {
userEvent.click(items[0]);
await user.click(items[0]);
} else {
fireEvent.keyDown(items[0], {key: ' '});
fireEvent.keyUp(items[0], {key: ' '});
Expand All @@ -735,7 +735,7 @@ describe('ListBox', () => {
onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
if (type === 'mouse') {
userEvent.dblClick(items[0], {pointerType: 'mouse'});
await user.dblClick(items[0], {pointerType: 'mouse'});
} else {
fireEvent.keyDown(items[0], {key: 'Enter'});
fireEvent.keyUp(items[0], {key: 'Enter'});
Expand Down
6 changes: 3 additions & 3 deletions packages/react-aria-components/test/Menu.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -269,7 +269,7 @@ describe('Menu', () => {

describe('supports links', function () {
describe.each(['mouse', 'keyboard'])('%s', (type) => {
it.each(['none', 'single', 'multiple'])('with selectionMode = %s', function (selectionMode) {
it.each(['none', 'single', 'multiple'])('with selectionMode = %s', async function (selectionMode) {
let onAction = jest.fn();
let onSelectionChange = jest.fn();
let tree = render(
Expand All @@ -291,11 +291,11 @@ describe('Menu', () => {
expect(items[1].tagName).toBe('A');
expect(items[1]).toHaveAttribute('href', 'https://adobe.com');

let onClick = jest.fn();
let onClick = jest.fn().mockImplementation(e => e.preventDefault());
window.addEventListener('click', onClick);

if (type === 'mouse') {
userEvent.click(items[1]);
await user.click(items[1]);
} else {
fireEvent.keyDown(items[1], {key: 'Enter'});
fireEvent.keyUp(items[1], {key: 'Enter'});
Expand Down
22 changes: 11 additions & 11 deletions packages/react-aria-components/test/Table.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -837,16 +837,16 @@ describe('Table', () => {

describe('links', function () {
describe.each(['mouse', 'keyboard'])('%s', (type) => {
let trigger = (item, key = 'Enter') => {
let trigger = async (item, key = 'Enter') => {
if (type === 'mouse') {
userEvent.click(item);
await user.click(item);
} else {
fireEvent.keyDown(item, {key});
fireEvent.keyUp(item, {key});
}
};

it('should support links with selectionMode="none"', function () {
it('should support links with selectionMode="none"', async function () {
let {getAllByRole} = render(
<Table aria-label="Table">
<MyTableHeader>
Expand Down Expand Up @@ -877,13 +877,13 @@ describe('Table', () => {

let onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
trigger(items[0]);
await trigger(items[0]);
expect(onClick).toHaveBeenCalledTimes(1);
expect(onClick.mock.calls[0][0].target).toBeInstanceOf(HTMLAnchorElement);
expect(onClick.mock.calls[0][0].target.href).toBe('https://google.com/');
});

it.each(['single', 'multiple'])('should support links with selectionBehavior="toggle" selectionMode="%s"', function (selectionMode) {
it.each(['single', 'multiple'])('should support links with selectionBehavior="toggle" selectionMode="%s"', async function (selectionMode) {
let {getAllByRole} = render(
<Table aria-label="Table" selectionMode={selectionMode}>
<MyTableHeader>
Expand Down Expand Up @@ -914,22 +914,22 @@ describe('Table', () => {

let onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
trigger(items[0]);
await trigger(items[0]);
expect(onClick).toHaveBeenCalledTimes(1);
expect(onClick.mock.calls[0][0].target).toBeInstanceOf(HTMLAnchorElement);
expect(onClick.mock.calls[0][0].target.href).toBe('https://google.com/');

userEvent.click(within(items[0]).getByRole('checkbox'));
await user.click(within(items[0]).getByRole('checkbox'));
expect(items[0]).toHaveAttribute('aria-selected', 'true');

onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
trigger(items[1], ' ');
await trigger(items[1], ' ');
expect(onClick).not.toHaveBeenCalled();
expect(items[1]).toHaveAttribute('aria-selected', 'true');
});

it.each(['single', 'multiple'])('should support links with selectionBehavior="replace" selectionMode="%s"', function (selectionMode) {
it.each(['single', 'multiple'])('should support links with selectionBehavior="replace" selectionMode="%s"', async function (selectionMode) {
let {getAllByRole} = render(
<Table aria-label="Table" selectionMode={selectionMode} selectionBehavior="replace">
<MyTableHeader>
Expand Down Expand Up @@ -961,7 +961,7 @@ describe('Table', () => {
let onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
if (type === 'mouse') {
userEvent.click(items[0]);
await user.click(items[0]);
} else {
fireEvent.keyDown(items[0], {key: ' '});
fireEvent.keyUp(items[0], {key: ' '});
Expand All @@ -972,7 +972,7 @@ describe('Table', () => {
onClick = jest.fn();
window.addEventListener('click', onClick, {once: true});
if (type === 'mouse') {
userEvent.dblClick(items[0], {pointerType: 'mouse'});
await user.dblClick(items[0], {pointerType: 'mouse'});
} else {
fireEvent.keyDown(items[0], {key: 'Enter'});
fireEvent.keyUp(items[0], {key: 'Enter'});
Expand Down
Loading

0 comments on commit ca4e5eb

Please sign in to comment.