Как выполнить модульное тестирование функционального компонента Vue.js с помощью функции рендеринга, которая возвращает любой массив элементов?

Question

Как выполнить модульное тестирование функционального компонента Vue.js с помощью функции рендеринга, которая возвращает любой массив элементов?

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

Решить проблему остановки.
Построить круг (имитировать «линейку и компас» метод для этого).
Разработайте проблему с продавцом в O (log n).
Шаблон будет довольно большим, поэтому убедитесь, что у вас есть алгоритм, который без потерь сжимает случайные данные.
Почти там - просто разделите все это к нулю. Easy-peasy.

Я еще не выяснил последнюю часть, но я знаю, что приближаюсь. Мой код продолжает бросать CthulhuRlyehWgahnaglFhtagnException в последнее время, поэтому я собираюсь передать его на VB 6 и использовать On Error Resume Next. Я обновлю код, как только я исследую эту странную дверь, которая только что открылась в стене. Хмм.

P.S. Пьер де Ферма также выяснил, как это сделать, но край, который он писал, был недостаточно большим для кода.

3

unit-testing javascript vue.js

задан Steven Lambert 17 January 2019 в 15:39

2 ответа

Другие вопросы по тегам:

unit-testing javascript vue.js

Похожие вопросы:

score 0 · Answer 1

Вы можете создать fragment_wrapper для упаковки ваших Компонентов с Фрагментами (несколькими корневыми элементами).

//File: fragment_wrapper.js

exports.fragment_wrapper = function(FragmentComponent){
  const wrapper = {
    components: { FragmentComponent },
    props: FragmentComponent.props,
    template: `<div><FragmentComponent v-bind="$props" v-on="$listeners"/></div>`
  }
  return wrapper;  
}

Затем вы можете использовать это для проверки всех ваших фрагментированных компонентов следующим образом:

import { mount } from '@vue/test-utils'
import { fragment_wrapper } from './fragment_wrapper'
import Cell from './components/Cell'


describe('Test Cell', () => {
  let WrappedCell = fragment_wrapper(Cell);
  const wrapper = mount(WrappedCell, {
    propsData: {
      cellData: {
        category: 'foo',
        description: 'bar'
      }
    }
  });

  it('renders the correct markup', () => {
    expect(wrapper.html()).toContain('<td>foo</td>')
  });
});

score 0 · Answer 2

Вы можете создать прозрачный компонент-оболочку более высокого порядка, который передает все реквизиты и прослушиватели событий внутреннему компоненту Cell, используя v-bind="$attrs" [1] и v-on="$listeners" [2] . Затем вы можете использовать propsData для передачи реквизита компоненту обертки.

import { mount } from '@vue/test-utils'
import Cell from '@/components/Cell'

const WrappedCell = {
  components: { Cell },
  template: `
    <div>
      <Cell v-bind="$attrs" v-on="$listeners" />
    </div>
  `
}

const wrapper = mount(WrappedCell, {
  propsData: {
    cellData: {
      category: 'foo',
      description: 'bar'
    }
  }
});