I have a helper which I use for Detox tests which hold abstractions of most commonly occurring actions. Like this.
/**
* Looks for a search input and inputs the query
*/
export const inputSearchQuery = async ({ query = '', placeholderText = '' }) => {
if (placeholderText) {
// look for search input
await expect(element(by.id(TestID.SEARCH_INPUT).withDescendant(by.text(placeholderText)))).toBeVisible();
// tap search input
await element(by.id(TestID.SEARCH_INPUT).withDescendant(by.text(placeholderText))).tap();
// type in query
await element(by.id(TestID.SEARCH_INPUT).withDescendant(by.text(placeholderText))).typeText(query);
} else {
// look for search input
await expect(element(by.id(TestID.SEARCH_INPUT))).toBeVisible();
// tap search input
await element(by.id(TestID.SEARCH_INPUT)).tap();
// type in query
await element(by.id(TestID.SEARCH_INPUT)).typeText(query);
}
};
I want this layer of abstraction to be tested with Jest. So I did the following,
describe('e2e helper', () => {
describe('inputSearchQuery()', () => {
test('should check whether the search input is visible', async () => {
const mockToBeVisible = jest.fn();
await inputSearchQuery({});
expect(mockToBeVisible).toBeCalledTimes(1);
});
});
});
And obviously got the error,
ReferenceError: element is not defined
I understand that element
comes from the environment. How do I configure my Jest setup...
"jest": {
"preset": "react-native",
"snapshotSerializers": [
"./node_modules/enzyme-to-json/serializer"
],
"transformIgnorePatterns": [
"node_modules/(?!(jest-)?react-native|react-navigation)"
],
"moduleNameMapper": {
"package.json": "<rootDir>/__mocks__/package.json"
},
"testPathIgnorePatterns": [
"/e2e/"
],
// I'm guessing something like this but doesn't work out of the box
"testEnvironment": "detox"
},
...to address this?