开玩笑反应离子应用程序 - 找不到@ionic/storage 模块

Question

我正在使用 Jest 为 ionic react 应用程序创建测试。

该应用是使用 create react app 创建的。

我为登录组件创建了一个基本测试：

import React from 'react';
import { render } from '@testing-library/react';
import Login from './Login';

test('renders without crashing', () => {
  const { baseElement } = render(<Login />);
  expect(baseElement).toBeDefined();
});

在登录组件中我有导入：

import { Storage } from '@ionic/storage';

我可以使用Storage 来处理存储，但是当我运行上面的测试时出现以下错误：

Test suite failed to run

Cannot find module '@ionic/storage' from 'src/pages/Login.tsx'

我正在使用 docker，并且该模块存在于 node_modules/@ionic/storage 中。

我搜索了很多，但到目前为止我没有找到解决方案。

Answer 1

我找不到正确的方法，但我有一个解决方法是：

在 src 文件夹中创建一个 __mocks__ 文件夹。在里面创建一个@ionic 文件夹，然后创建两个文件： storage.d.ts 和 storage.ts 文件是：

storage.d.ts

/** @hidden */
export declare const Drivers: {
  SecureStorage: string;
  IndexedDB: string;
  LocalStorage: string;
};

export interface StorageConfig {
  name?: string;
  version?: number;
  size?: number;
  storeName?: string;
  description?: string;
  driverOrder?: Driver[];
  dbKey?: string;
}

export declare type Database = any;

declare type Driver = any;

export declare class Storage {
  private _config;

  private _db;

  private _secureStorageDriver;

  /**
   * Create a new Storage instance using the order of drivers and any additional config
   * options to pass to LocalForage.
   *
   * Possible default driverOrder options are: ['indexeddb', 'localstorage'] and the
   * default is that exact ordering.
   *
   * When using Ionic Secure Storage (enterprise only), use ['ionicSecureStorage', 'indexeddb', 'localstorage'] to ensure
   * Secure Storage is used when available, or fall back to IndexedDB or LocalStorage on the web.
   */
  constructor(config?: StorageConfig);

  create(): Promise<Storage>;

  /**
   * Define a new Driver. Must be called before
   * initializing the database. Example:
   *
   * await storage.defineDriver(myDriver);
   * await storage.create();
   */
  defineDriver(driver: Driver): Promise<void>;

  /**
   * Get the name of the driver being used.
   * @returns Name of the driver
   */
  get driver(): string | null;

  // eslint-disable-next-line @typescript-eslint/member-ordering
  private readonly assertDb;

  /**
   * Get the value associated with the given key.
   * @param key the key to identify this value
   * @returns Returns a promise with the value of the given key
   */
  get(key: string): Promise<any>;

  /**
   * Set the value for the given key.
   * @param key the key to identify this value
   * @param value the value for this key
   * @returns Returns a promise that resolves when the key and value are set
   */
  set(key: string, value: any): Promise<any>;

  /**
   * Remove any value associated with this key.
   * @param key the key to identify this value
   * @returns Returns a promise that resolves when the value is removed
   */
  remove(key: string): Promise<any>;

  /**
   * Clear the entire key value store. WARNING: HOT!
   * @returns Returns a promise that resolves when the store is cleared
   */
  clear(): Promise<void>;

  /**
   * @returns Returns a promise that resolves with the number of keys stored.
   */
  length(): Promise<number>;

  /**
   * @returns Returns a promise that resolves with the keys in the store.
   */
  keys(): Promise<string[]>;

  /**
   * Iterate through each key,value pair.
   * @param iteratorCallback a callback of the form (value, key, iterationNumber)
   * @returns Returns a promise that resolves when the iteration has finished.
   */
  forEach(
    iteratorCallback: (value: any, key: string, iterationNumber: Number) => any
  ): Promise<void>;

  setEncryptionKey(key: string): void;
}
export {};

storage.ts

import LocalForage from "localforage";
/** @hidden */
export const Drivers = {
  SecureStorage: "ionicSecureStorage",
  IndexedDB: LocalForage.INDEXEDDB,
  LocalStorage: LocalForage.LOCALSTORAGE,
};
const defaultConfig = {
  name: "_ionicstorage",
  storeName: "_ionickv",
  dbKey: "_ionickey",
  driverOrder: [Drivers.SecureStorage, Drivers.IndexedDB, Drivers.LocalStorage],
};
export class Storage {
  /**
   * Create a new Storage instance using the order of drivers and any additional config
   * options to pass to LocalForage.
   *
   * Possible default driverOrder options are: ['indexeddb', 'localstorage'] and the
   * default is that exact ordering.
   *
   * When using Ionic Secure Storage (enterprise only), use ['ionicSecureStorage', 'indexeddb', 'localstorage'] to ensure
   * Secure Storage is used when available, or fall back to IndexedDB or LocalStorage on the web.
   */
  constructor(config = defaultConfig) {}

  async create() {}

  /**
   * Get the value associated with the given key.
   * @param key the key to identify this value
   * @returns Returns a promise with the value of the given key
   */
  get(key: any) {}

  /**
   * Set the value for the given key.
   * @param key the key to identify this value
   * @param value the value for this key
   * @returns Returns a promise that resolves when the key and value are set
   */
  set(key: any, value: any) {}

  /**
   * Remove any value associated with this key.
   * @param key the key to identify this value
   * @returns Returns a promise that resolves when the value is removed
   */
  remove(key: any) {}

  /**
   * Clear the entire key value store. WARNING: HOT!
   * @returns Returns a promise that resolves when the store is cleared
   */
  clear() {}

  /**
   * @returns Returns a promise that resolves with the number of keys stored.
   */
  length() {}

  /**
   * @returns Returns a promise that resolves with the keys in the store.
   */
  keys() {}
}

这让我的测试运行，我可以输入我需要的模拟数据。

我知道这并不完美或完全正确，但它让我可以继续运行我的项目进行其他测试