Ложный топор ios запрос nuxt - PullRequest
Новая
       63

Ложный топор ios запрос nuxt

0 голосов
/ 06 апреля 2020

У меня есть функция для получения данных из API. 

async getEvents() {
      await this.$axios
        .get("events")
        .then(response => {
          if (response.status === 200) {
            const data = response.data
            const labels = data.map(dateCount => dateCount.day)
            const amount = data.map(dateCount => dateCount.amount)
            this.labels = labels
            this.chartdata = amount
          }
        })
    }

Эта функция вызывается в Mounting (). Теперь я хочу проверить, правильно ли обрабатываются данные с помощью Jest JS.

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

Я пытался использовать Mox ios, но не смог заставить его работать. Я попробовал следующее: 

test("has 3 events", () => {
    moxios.install()

    expect(wrapper.vm.labels).toBeNull()

    const data = {
      status: 200,
      data: [
        {
          "day":"2018-03-01",
          "amount":3069
        },
        {"day":"2018-03-02",
          "amount":3468
        },
        {"day":"2018-03-03",
          "amount":3602
        }
      ]
    }

    wrapper.vm.getEvents()

    moxios.wait(function () {
      let request = moxios.requests.mostRecent()
      request.respondWith(data).then(function () {
      })
    })

    expect(wrapper.vm.labels).toBe(["2018-03-01", "2018-03-02", "2018-03-03"])
  })

1 Ответ

0 голосов
/ 08 апреля 2020

Я нашел это! Я сейчас использую ax ios -mock-адаптер. Это отлично работает. Я немного изменил метод, потому что во время теста я получил предупреждения: 

(node:49889) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'get' of undefined

$ ax ios не определено, если кто-то знает, как я могу это исправить, пожалуйста, дайте мне знать!

Я настроил тест следующим образом: 

import axios from "~/plugins/axios";
const MockAdapter = require("axios-mock-adapter");
const mock = new MockAdapter(axios);

import {shallowMount} from "@vue/test-utils"

test("get events", async () => {
    mock.onGet("events")
      .reply(200, [
        {"day": "2018-03-01", "amount": 3069},
        {"day": "2018-03-02", "amount": 3468},
        {"day": "2018-03-03","amount": 3602}
        ])

    await wrapper.vm.getEvents()

    expect(wrapper.vm.$data.labels).toStrictEqual(["2018-03-01", "2018-03-02", "2018-03-03"])
    expect(wrapper.vm.$data.chartdata).toStrictEqual([3069, 3468, 3602])

  })

И метод: 

async getEvents() {
      this.loading = true
      await axios({
        method: "get",
        url: "events"
      })
        .then(response => {
          if (response.status === 200) {
            this.parseEventData(response.data)
          }
          this.loading = false
        })
        .catch(() => {
          this.loading = false
          this.error = true
        })
    },
...