首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >找不到Jest react ionic应用-@ionic/存储模块

找不到Jest react ionic应用-@ionic/存储模块
EN

Stack Overflow用户
提问于 2021-04-26 23:34:52
回答 1查看 146关注 0票数 1

我正在使用Jest为离子反应应用程序创建测试。

应用程序是使用create react应用程序创建的。

我为Login组件创建了一个基本测试:

代码语言:javascript
运行
复制
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();
});

在登录组件中,我有一个导入:

代码语言:javascript
运行
复制
import { Storage } from '@ionic/storage';

我可以使用Storage来处理存储,但是当我运行上面的测试时,我得到了以下错误:

代码语言:javascript
运行
复制
Test suite failed to run

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

我正在使用docker,这个模块存在于node_modules/@ionic/storage中。

我在谷歌上搜索了很多,但到目前为止我还没有找到解决方案。

EN

回答 1

Stack Overflow用户

发布于 2021-06-18 09:15:56

我找不到合适的方法来做这件事,但我有一个变通的办法是:

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

storage.d.ts

代码语言:javascript
运行
复制
/** @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

代码语言:javascript
运行
复制
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() {}
}

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

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

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/67269595

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档