Ожидает ли "найти" в Cypress ожидание завершения запросов GraphQL? - PullRequest
Новая
       6

Ожидает ли "найти" в Cypress ожидание завершения запросов GraphQL?

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

Я учусь писать тесты для стекового приложения MERNQ и использую Cypress в качестве инструмента сквозного тестирования.Я пытаюсь убедиться, что мои тесты написаны правильно, чтобы они работали как долгосрочное решение.На данный момент у меня есть только один запрос на рассматриваемый маршрут, и у меня есть следующий тестовый код: 

describe('Song API', () => {
    it('should show at least one song', () => {
        cy.server();
        // cy.route('GET', '/graphql').as('graphql');
        cy.route({
            method: 'GET', // Route all GET requests
            url: 'http://localhost:8080/graphql', // that have a URL that matches '/graphql'
            response: {
                data: {
                    loading: false,
                    songs: [
                        {
                            id: 1,
                            name: 'Boo Ya',
                        },
                    ],
                },
            },
        }).as('getSongs');
        cy.visit('http://localhost:8080').then(() => {
            cy.get('.collection').find('.collection-item');
        });
    });
});

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

Это кажется мне очень странным.

Мой компонент выглядит так: 

import React from 'react';
import gql from 'graphql-tag';
import { graphql } from 'react-apollo';

const SongList = ({ data }) => {
    // console.log(data);
    function renderSongs() {
        console.log(data);
        if (data.loading) {
            return <p>Loading...</p>;
        } else {
            return data.songs.map(song => {
                return (
                    <li key={song.key} className="collection-item">
                        {song.title}
                    </li>
                );
            });
        }
    }

    return <ul className="collection">{renderSongs()}</ul>;
};

const query = gql`
    query getSongs {
        songs {
            key: id
            title
        }
    }
`;

export default graphql(query)(SongList);

Есть мысли или замечания?

1 Ответ

1 голос
/ 23 апреля 2019

Итак, я получил данные с заглушками для правильного ответа. Мой тест выглядит следующим образом: 

describe('Song API', () => {
    it('should show at least one song', () => {
        cy.server();
        cy.route('POST', 'http://localhost:8080/graphql', {
            data: {
                songs: [
                    {
                        key: 1,
                        title: 'Hey Ya',
                        __typename: 'SongType',
                    },
                    {
                        key: 2,
                        title: 'Gangsters Paradise',
                        __typename: 'SongType',
                    },
                    {
                        key: 3,
                        title: 'Other Name',
                        __typename: 'SongType',
                    },
                ],
            },
        }).as('getSongs');
        cy.visit('http://localhost:8080')
            .wait('@getSongs')
            .then(() => {
                cy.get('.collection').find('.collection-item');
            });
    });
});

Я все еще думаю, что есть много возможностей для улучшения с возможностью получить правильный ответ по имени представленного запроса.

...