Макет подборки изображений в React Native Detox

#javascript #react-native #jestjs #detox

#javascript #react-native #jestjs #детоксикация

Вопрос:

Я пытаюсь смоделировать пакет react-native-image-crop-picker (в частности, функцию OpenCamera) в Detox, но мне это не удается. Detox просто не рассматривает макет.

.detoxrc.json:

 {
  "testRunner": "jest",
  "runnerConfig": "e2e/config.json",
  "uiHierarchy": "enabled",
  "configurations": {
    "android.emu.debug": {
      "binaryPath": "android/app/build/outputs/apk/debug/app-debug.apk",
      "build": "yarn detox:prepare",
      "type": "android.emulator",
      "device": {
        "avdName": "Pixel_4_API_29"
      }
    }
  }
}
 

.config.json:

 {
  "preset": "ts-jest",
  "testEnvironment": "./environment",
  "testRunner": "jest-circus/runner",
  "testTimeout": 120000,
  "reporters": ["detox/runners/jest/streamlineReporter"],
  "verbose": true,
  "testMatch": [
    "**/__tests__/**/*.js?(x)",
    "**/?(*.)(e2e).js?(x)",
    "**/__tests__/**/*.ts?(x)",
    "**/?(*.)(e2e).ts?(x)"
  ]
}
 

config.js:

 require('@babel/register')({
  //cache: true,
  presets: [require('metro-react-native-babel-preset')],
  plugins: [require('@babel/plugin-transform-runtime').default],
  only: ['./e2e', './ts', './js'],
  ignore: ['node_modules'],
});
 

environment.js:

 const {
  DetoxCircusEnvironment,
  SpecReporter,
  WorkerAssignReporter,
} = require('detox/runners/jest-circus');

class CustomDetoxEnvironment extends DetoxCircusEnvironment {
  constructor(config) {
    super(config);

    // Can be safely removed, if you are content with the default value (=300000ms)
    this.initTimeout = 300000;

    // This takes care of generating status logs on a per-spec basis. By default, Jest only reports at file-level.
    // This is strictly optional.
    this.registerListeners({
      SpecReporter,
      WorkerAssignReporter,
    });
  }
}

module.exports = CustomDetoxEnvironment;
 

metro.config.js:

 const blacklist = require('metro-config/src/defaults/blacklist');
const defaultSourceExts = require('metro-config/src/defaults/defaults')
  .sourceExts;

/**
 * Metro configuration for React Native
 * https://github.com/facebook/react-native
 *
 * @format
 */

module.exports = {
  transformer: {
    getTransformOptions: async () => ({
      transform: {
        experimentalImportSupport: false,
        inlineRequires: false,
      },
    }),
  },
  /**
   *
   * Blacklist is a function that takes an array of regexes
   * and combines them with the default blacklist to return a single regex.
   *
   */
  resolver: {
    blacklistRE: blacklist([/./amplify/.*/]),
    sourceExts: process.env.RN_SRC_EXT
      ? process.env.RN_SRC_EXT.split(',').concat(defaultSourceExts)
      : defaultSourceExts,
  },
};
 

Папка E2E:
Папка E2E

ImageCropPicker.e2e.js:

 import ImageCropPicker from 'react-native-image-crop-picker';

ImageCropPicker.openCamera = function openCamera() {
  console.tron.log('mocked');
  return {
    mime: 'test',
    data: 'test',
  };
};
 

Я также попытался поместить ImageCropPicker.e2e.js файл вне папки mocks, но это тоже не сработало.

Версии Detox, узла, устройства и ОС:

  • Детоксикация: 17.6.0
  • Узел: 10.23.0
  • Устройство: Pixel 4 API 29
  • ОС: Linux Pop!_OS 20.10
  • React-Native: 0.62.0

Вы можете мне помочь? Я ценю ваше время!

Комментарии:

1. Проверьте это medium.com/geekculture /… . В нем объясняется, как решать проблемы с помощью mock.