Как бы я провел тестирование компонентов, если мой компонент требует доступа к базе данных - PullRequest
0 голосов
/ 15 апреля 2019

Я создал электронное приложение, которое сохраняет данные в NeDB, которые отображают данные через приложение.Я пытаюсь протестировать свой компонент, который отображает данные с шуткой и энзимом, но мой простой тест не пройден, потому что одному из моих модулей, который импортирован в файл, требуется доступ к свойству, которое определяется только при запуске электронного приложения.

Я новичок в создании электронного приложения, поэтому моя архитектура может быть плохой.

Основная проблема заключается в том, что при попытке запустить тест я получаю сообщение об ошибке:

 TypeError: Cannot read property 'app' of undefined

  1 | const remote = require('electron').remote;
> 2 | const app = remote.app;

Как мне исправить это?Некоторые возможные вещи, которые, как я думал, могли бы сработать, заключались в том, чтобы использовать шутку для насмешки над SchoolAPI, но я не уверен, как это сделать.

SchoolList.js

import React from "react";
// @material-ui/core components
import withStyles from "@material-ui/core/styles/withStyles";
import List from "@material-ui/core/List";
import ListItem from "@material-ui/core/ListItem";
import ListItemText from "@material-ui/core/ListItemText";
import ListItemSecondaryAction from '@material-ui/core/ListItemSecondaryAction';
import IconButton from '@material-ui/core/IconButton';
import DeleteIcon from '@material-ui/icons/Delete';

import { Link } from "react-router-dom";

import * as SchoolAPI from "../../utils/SchoolAPI.js"

class SchoolList extends React.Component {
    constructor(props) {
        super(props);
    };

    handleDelete = (id) => {
        SchoolAPI.deleteSchool(id).then(() => {
            this.props.onLoadData();
        });
    };
    render() {
        const { classes } = this.props;
        const listSchools = this.props.schoolsData.map((school, i) =>
            <div key={i}>
                <ListItem button component={Link} to={`/orders/${i}`}>
                    <ListItemText primary={school.name}/>
                    <ListItemSecondaryAction onClick={() => this.handleDelete(school["_id"])}>
                        <IconButton aria-label="Delete" >
                            <DeleteIcon />
                        </IconButton>
                    </ListItemSecondaryAction>
                </ListItem>
            </div>
        );
        return (
            <List className="schoolList">
                {listSchools}
            </List>
        );
    };
}

SchoolAPI.js

import db from "../db.js"
...a bunch of API(e.g. db.insert(..))

дБ.js

const remote = require('electron').remote;
const app = remote.app;
const path = require('path');
const Datastore = require('nedb-promises');

const dbFactory = (fileName) => Datastore.create({
  filename: `${process.env.NODE_ENV === 'dev' ? '.' : app.getPath('userData')}/data/${fileName}`, 
  timestampData: true,
  autoload: true
});

const db = {
  schools: dbFactory('schools.db')
};

module.exports = db;

test.spec.js

describe("SchoolList component", () => {
    it("renders without throwing an error", () => {
        const SchoolListComponent = renderer.create(<SchoolList schoolsData={schoolsData/>).toJson();
        expect(SchoolListComponent).toMatchSnapshot();
    });
});

1 Ответ

0 голосов
/ 16 апреля 2019

Вы действительно должны издеваться над SchoolAPI, поскольку ваш компонент требует только SchoolAPI, при удалении он не должен слишком сильно влиять на ваш компонент.Школьные данные, которые вы можете просто посмеяться и вставить в компонент, если это будет необходимо.Таким образом, это выглядело бы следующим образом:

jest.mock('./path/to/SchoolAPI');

describe("SchoolList component", () => {
  it("renders without throwing an error", () => {
      const SchoolListComponent = renderer.create(<SchoolList schoolsData={schoolsData/>).toJson();
      expect(SchoolListComponent).toMatchSnapshot();
  });
});

Если вы хотите иметь макеты, которые ведут себя подобно оригинальным реализациям, а не заставлять их просто ничего не возвращать, вы можете посмотреть в jest manual mocks

...