How to name css color

if you are wondering how to name a CSS in variables of scss/js please enter a hex into this page: https://chir.ag/projects/name-that-color/#EE4444

ReactNative: How to setup Bugsnag stage in Native files

you need to use react-native-config and setup it for each schema/Android flavor (eg. .env.demo)

...
ENV=demo
...

iOS

inside file AppDelegate.m put

  NSString *envFromConfig = [ReactNativeConfig envFor:@"ENV"];
  BugsnagConfiguration *config = [BugsnagConfiguration loadConfig];
  config.releaseStage = envFromConfig;
  [Bugsnag startWithConfiguration:config];

instead of [Bugsnag start]; inside didFinishLaunchingWithOptions

Android

inside MainApplication.java put additional imports at the top of it

import com.bugsnag.android.Bugsnag;
import com.bugsnag.android.Configuration;

then inside onCreate put

        Configuration config = Configuration.load(this);
        config.setReleaseStage(BuildConfig.ENV);
        Bugsnag.start(this, config);

instead of simple Bugsnag.start(this)

ReactNative: How to disable Bugsnag in DEV

Sometimes this is hard to disable Bugsnag inside DEV mode, we can simple disable it inside JS thread.

Bugsnag.start({
  onError: () => {
    if (__DEV__) {
      return false;
    } else {
      return true;
    }
  },
  plugins: [new BugsnagPluginReactNavigation()],
});

Remember that Native crashes will be reported anyway in this solution.

Very fast way to patch ReactNative Native libraries

For example, you can change the native code of react-native-firebase

install patch-package from here

yarn add --dev patch-package

make a change inside the native code

eg. code node_modules/react-native-firebase/ios/RNFirebase/notifications/RNFirebaseNotifications.m

make patch

patch-package react-native-firebase

add post-install script

eg. "postinstall": "patch-package && ./scripts/postinstall.sh",

and enjoy your fix :D

probably CircleCI require more love from you, but you can check the package documentation

Jest.js haveBeenCalledWith anything()

Sometimes we want to check if the callback has been called with some arguments, but providing all of them can be hard (some nested structure with other callbacks, etc.)

We can check however some of the calling arguments and replace rest with expect.anything()

  it('should trigger confirmation when clicking on report lost button', () => {
    const { container, getByTestId } = render(<ReportScreen />);
    Alert.alert = jest.fn();
    const reportLostButton = getByTestId('reportLostButton');
    act(() => {
      fireEvent.press(reportLostButton);
    })
    expect(Alert.alert).toHaveBeenCalledWith(
      'Report as lost', 
      expect.anything(), 
      expect.anything(), 
      expect.anything()
    );
  });