[HOLD] Add Automated Tests for Onyx / withOnyx

package.json

@@ -18,6 +18,7 @@
  "android-build": "fastlane android build",
  "test": "jest",
  "lint": "eslint .",
+ "lint-tests": "eslint tests/**",
  "postversion": "react-native-version",
  "print-version": "echo $npm_package_version",
  "detox-build": "detox build --configuration ios.sim.debug",

src/CONFIG.js

@@ -11,6 +11,7 @@ export default {
  },
  // eslint-disable-next-line no-undef
  IS_IN_PRODUCTION: Platform.OS === 'web' ? process.env.NODE_ENV === 'production' : !__DEV__,
+ IS_JEST_RUNNING: typeof jest !== 'undefined',
  PUSHER: {
  APP_KEY: Config.PUSHER_APP_KEY,
  CLUSTER: 'mt1',

src/libs/Log.js

@@ -46,5 +46,5 @@ export default new Logger({
  clientLoggingCallback: (message) => {
  console.debug(message);
  },
- isDebug: !CONFIG.IS_IN_PRODUCTION,
+ isDebug: !CONFIG.IS_JEST_RUNNING && !CONFIG.IS_IN_PRODUCTION,
 });

tests/components/ViewWithText.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import {View, Text} from 'react-native';
+
+const propTypes = {
+ text: PropTypes.string.isRequired,
+};
+
+const ViewWithText = props => (
+ <View>
+ <Text>{props.text}</Text>
+ </View>
+);
+
+ViewWithText.propTypes = propTypes;
+export default ViewWithText;

tests/unit/onyxTest.js

@@ -0,0 +1,155 @@
+import 'react-native';
+import Onyx from 'react-native-onyx';
+
+const TEST_KEY = 'test';
+
+jest.mock('../../node_modules/@react-native-community/async-storage',
+ () => require('./mocks/@react-native-community/async-storage'));
+
+Onyx.registerLogger(() => {});
+Onyx.init({
+ keys: {
+ TEST_KEY,
+ COLLECTOnyx: {},
+ },
+ registerStorageEventListener: () => {},
+});
+
+describe('Onyx', () => {
+ let connectionID;
+
+ afterEach((done) => {
+ Onyx.disconnect(connectionID);
+ Onyx.clear().then(done);
+ });
+
+ it('should set a simple key', (done) => {
+ const mockCallback = jest.fn();
+ connectionID = Onyx.connect({
+ key: TEST_KEY,
+ initWithStoredValues: false,
+ callback: (value) => {
+ mockCallback(value);
+
+ try {
+ expect(value).toBe('test');
+ done();
+ } catch (error) {
+ done(error);
+ }
+ }
+ });
+
+ // Set a simple key
+ Onyx.set(TEST_KEY, 'test');
+ });
+
+ it('should merge an object with another object', (done) => {
+ const mockCallback = jest.fn();
+ connectionID = Onyx.connect({
+ key: TEST_KEY,
+ initWithStoredValues: false,
+ callback: (value) => {
+ mockCallback(value);
+
+ try {
+ if (mockCallback.mock.calls.length === 1) {
+ expect(value).toStrictEqual({
+ test1: 'test1',
+ });
+ return;
+ }
+
+ expect(value).toStrictEqual({
+ test1: 'test1',
+ test2: 'test2',
+ });
+ done();
+ } catch (error) {
+ done(error);
+ }
+ }
+ });
+
+ Onyx.set(TEST_KEY, {test1: 'test1'});
+ Onyx.merge(TEST_KEY, {test2: 'test2'});
+ });
+
+ it('should notify subscribers when data has been cleared', (done) => {
+ const mockCallback = jest.fn();
+ connectionID = Onyx.connect({
+ key: TEST_KEY,
+ initWithStoredValues: false,
+ callback: (value) => {
+ mockCallback(value);
+
+ try {
+ if (mockCallback.mock.calls.length === 1) {
+ expect(value).toBe('test');
+ return;
+ }
+
+ expect(value).toBe(null);
+ done();
+ } catch (error) {
+ done(error);
+ }
+ }
+ });
+
+ Onyx.set(TEST_KEY, 'test');
+ Onyx.clear();
+ });
+
+ it('should not notify subscribers after they have disconnected', (done) => {
+ const mockCallback = jest.fn();
+ connectionID = Onyx.connect({
+ key: TEST_KEY,
+ initWithStoredValues: false,
+ callback: (value) => {
+ mockCallback(value);
+ expect(value).toBe('test');
+ }
+ });
+
+ Onyx.set(TEST_KEY, 'test')
+ .then(() => {
+ Onyx.disconnect(connectionID);
+ return Onyx.set(TEST_KEY, 'test updated');
+ })
+ .then(() => {
+ try {
+ expect(mockCallback.mock.calls.length).toBe(1);
+ done();
+ } catch (error) {
+ done(error);
+ }
+ });
+ });
+
+ it('should merge arrays by appending new items to the end of a value', (done) => {
+ const mockCallback = jest.fn();
+ connectionID = Onyx.connect({
+ key: TEST_KEY,
+ initWithStoredValues: false,
+ callback: (value) => {
+ mockCallback(value);
+
+ try {
+ if (mockCallback.mock.calls.length === 1) {
+ expect(value).toStrictEqual(['test1']);
+ return;
+ }
+
+ expect(value).toStrictEqual(['test1', 'test2', 'test3', 'test4']);
+ done();
+ } catch (err) {
+ done(err);
+ }
+ }
+ });
+
+ Onyx.set(TEST_KEY, ['test1']);
+ Onyx.merge(TEST_KEY, ['test2', 'test3', 'test4']);
+ });
+});

tests/unit/withOnyxTest.js

@@ -0,0 +1,43 @@
+import 'react-native';
+import {render} from '@testing-library/react-native';
+import React from 'react';
+import Onyx, {withOnyx} from 'react-native-onyx';
+import ViewWithText from '../components/ViewWithText';
+
+import waitForPromisesToResolve from '../utils/waitForPromisesToResolve';
+
+const TEST_KEY = 'test';
+
+jest.mock('../../node_modules/@react-native-community/async-storage',
+ () => require('./mocks/@react-native-community/async-storage'));
+
+Onyx.registerLogger(() => {});
+Onyx.init({
+ keys: {
+ TEST_KEY,
+ COLLECTION: {},
+ },
+ registerStorageEventListener: () => {},
+});
+
+describe('withOnyx', () => {
+ it('should render with the test data when using withOnyx', () => {
+ let result;
+
+ Onyx.set(TEST_KEY, 'test1')
+ .then(() => {
+ const TestComponentWithOnyx = withOnyx({
+ text: {
+ key: TEST_KEY,
+ },
+ })(ViewWithText);
+
+ result = render(<TestComponentWithOnyx />);
+ return waitForPromisesToResolve();
+ })
+ .then(() => {
+ const textComponent = result.getByText('test1');
+ expect(textComponent).toBeTruthy();
+ });
+ });
+});

tests/utils/waitForPromisesToResolve.js

@@ -0,0 +1 @@
+export default () => new Promise(setImmediate);