小编Can*_*nta的帖子

是否可以用玩笑来模拟打字稿界面？

例如：

import { IMultiplier } from "./IMultiplier";

export class Math {
  multiplier: IMultiplier;

  public multiply (a: number, b: number) {
    return this.multiplier.multiply(a, b);
  }
}

然后在测试中：

import { Math } from "../src/Math";
import { IMultiplier } from "../src/IMultiplier";

describe("Math", () => {

    it("can multiply", () => {
        let mathlib = new Math();
        mathlib.multiplier = // <--- assign this property a mock
        let result = mathlib.multiply(10, 2);
        expect(result).toEqual(20);
    });
});

我尝试创建一个模拟对象来通过多种方式满足此要求，但是没有任何效果。例如，为其分配此模拟：

let multiplierMock = jest.fn(() => ({ multiply: jest.fn() })); …

我试图在某个视口宽度的组件上运行测试.我正在做以下事情,但这似乎没有改变它:

test('Component should do something at a certain viewport width.', () => {
    global.innerWidth = 2000;
    const component = mount(<SomeComponent />);
    ...
});

我还发现了一篇文章,解释了如何使用JSDom来实现它,但是当Jest现在随JSDom提供时,我想知道是否有本机解决方案.

https://www.codementor.io/pkodmad/dom-testing-react-application-jest-k4ll4f8sd

我读了3次vue-utils-test文档和jest的文档,但是我不知道如何在vue组件中模拟vue mixins并测试组件.

所以我jest用来测试我的node.js应用程序并且测试结果很好,但是我从jest获得了关于打开句柄的消息.任何见解？

jest --detectOpenHandles

PASS src/libs/user/tests /user_model_test.js PASS src/tests /app_test.js PASS src/libs/user/tests /user_service_test.js

测试套件:3次通过,总共3次测试:14次通过,总共14次快照:0总时间:7.209s跑完所有测试套件.

Jest检测到以下4个打开的句柄可能使Jest退出:

●承诺

  2 | // we use a test database for testing
  3 | var mongoDB = 'mongodb://localhost/my_db_conn';
> 4 | mongoose.connect(mongoDB);
    |          ^
  5 | const User = require('../user_model');
  6 |
  7 | describe("User model test", () => {

  at NativeConnection.Object.<anonymous>.Connection.openUri (node_modules/mongoose/lib/connection.js:424:19)
  at Mongoose.Object.<anonymous>.Mongoose.connect (node_modules/mongoose/lib/index.js:208:15)
  at Object.<anonymous> (src/libs/user/__tests__/user_model_test.js:4:10)

Run Code Online (Sandbox Code Playgroud)

●承诺

   8 | });
   9 |
> 10 | module.exports = mongoose.model("User", UserSchema); …

Run Code Online (Sandbox Code Playgroud)

我有以下组件:

import React, { Component } from 'react';
import {Link, IndexLink} from 'react-router';

class Navbar extends Component {

  renderLinks = (linksData) => {
    return linksData.map((linkData) => {
      if(linkData.to === '/') {
        return(
          <div className="navbar-link-container" key={linkData.to}>
            <IndexLink activeClassName="navbar-active-link" to={linkData.to}>
              <i className="navbar-icon material-icons">{linkData.icon}</i>
              <span className="navbar-link-text">{linkData.text}</span>
            </IndexLink>
          </div>
        )
      }
      else {
        return(
          <div className="navbar-link-container" key={linkData.to}>
            <Link activeClassName="navbar-active-link" to={linkData.to}>
              <i className="navbar-icon material-icons">{linkData.icon}</i>
              <span className="navbar-link-text">{linkData.text}</span>
            </Link>
          </div>
        )
      }
    })
  };

  render() {
    return (
      <div className={`navbar navbar-${this.props.linksData.length}`}>
        {this.renderLinks(this.props.linksData)}
      </div>
    )
  }
}

Navbar.propTypes …

我在配置 sonarqube 时遇到问题，无法与 React + Jest 一起正常工作。

我的配置：

my_moudle.sonar.projectBaseDir=front_app my_module.sonar.javascript.file.suffixes=.js,.jsx

my_module.sonar.tests=src

my_module.sonar.test.inclusions=**/__tests__/** my_module.sonar.javascript.lcov.reportPaths=coverage/lcov.info

目前我将 src 文件夹指向为测试文件夹，因为我在同一项目文件夹中的测试文件夹中为每个组件设置了一组测试。感谢 SonarJS，我对我的项目有适当的覆盖，但我不知道为什么我看不到覆盖度量指标中的单元测试数量。任何检查的配置将不胜感激。

谢谢，巴布

在我的组件中，我有这样的代码：

this.videoRef.current.pause();

哪里videoRef是<video ref={this.videoRef} autoPlay muted > ...

当pause测试达到了，我得到一个错误：

 Error: Not implemented: HTMLMediaElement.prototype.pause

如何模拟暂停功能？

    const wrapper = mount(<ComponentWithVideoTag />);

    const el = wrapper.find('video').props();
    Object.defineProperty(el, 'paused', {
        writable: true,
        value: jest.fn(),
    });

不为我工作。

我正在使用 React Native 构建我的应用程序，并使用 Jest 和 Enzyme 进行单元测试。如何测试 my<FlatList />的renderItem()功能？

它<ListItem />从 React-Native-Elements 库返回一个。

让我给你示例代码：

import { ListItem } from 'react-native-elements'

export class MyList extends Component {
  const list = [
    {
      name: 'Amy Farha',
      subtitle: 'Vice President'
    },
    {
      name: 'Chris Jackson',
      avatar_url: 'https://s3.amazonaws.com/uifaces/faces/twitter/adhamdannaway/128.jpg',
      subtitle: 'Vice Chairman'
    },
    ... // more items
  ]

  keyExtractor = (item, index) => index

  renderItem = ({ item }) => (
    <ListItem
      title={item.name}
      subtitle={item.subtitle}
      leftAvatar={{
        source: item.avatar_url && …

我正在尝试测试我的react组件的渲染,但是得到以下错误: 不变违例:_registerComponent(...):目标容器不是DOM元素. 如果我更改下面在document.body上渲染我的组件的位置,则不存在错误,如果此位置是某个div,并且在body中有一些id,则存在错误.

这是我的组件:

import React, {Component} from 'react';
{render} from 'react-dom';
import Demo from './demo/demo'
import Demo2 from  './demo2/demo2'
require('./app-styles.sass')

export class App extends Component {
render() {
    return (
           <div>
               <Demo2 />
               <Demo />
               <div>Hello jest from react</div>
           </div>
       );
   }
}
render(<App/>, document.getElementById('helloWorldRoot'));

测试这个组件:

import React from 'react'
import {shallow, mount} from 'enzyme'
import {App} from './app'

describe('base component', () => {
  it('renders as a div', () => {
    const application = shallow(<App />);
    expect(application).toMatchSnapshot();
  });
}); …

说我有这个简单的React组件:

class Greeting extends React.Component {
    constructor() {
        fetch("https://api.domain.com/getName")
            .then((response) => {
                return response.text();
            })
            .then((name) => {
                this.setState({
                    name: name
                });
            })
            .catch(() => {
                this.setState({
                    name: "<unknown>"
                });
            });
    }

    render() {
        return <h1>Hello, {this.state.name}</h1>;
    }
}

鉴于以下答案以及对该主题的更多研究,我已经提出了最终解决方案来测试resolve()案例:

test.only("greeting name is 'John Doe'", async () => {
    const fetchPromise = Promise.resolve({
        text: () => Promise.resolve("John Doe")
    });

    global.fetch = () => fetchPromise;

    const app = await shallow(<Application />);

    expect(app.state("name")).toEqual("John Doe");
});

哪个工作正常.我的问题现在正在测试catch()案例.以下不起作用,因为我期望它工作:

test.only("greeting name …