Как добавить элементы DOM в тесты жасмина без использования внешних html файлов?

Я пишу некоторые простые тесты жасмина, и я получаю исключение, так как тестируемый код ищет форму, которая не существует, потому что там нет DOM при тестировании только файла js: $("form")[0] in проверенный файл js приводит к:

TypeError: $(...)[0] is undefined

Я немного прочитал о jasmine-jquery и понял, что могу использовать некоторые html-инструменты с внешним html файлом. Этот поток кажется довольно запутанным, так как все, что мне нужно сделать, это только добавить пустую действительную форму, чтобы тест (который фокусировался на чем-то еще) будет работать, что-то вроде добавления <form></form> будет достаточно, я думаю.

Сначала я думал, что функция sandbox() будет решением, но кажется, что она создает только divs, и мне нужна форма.

Любой простой способ добавить некоторые элементы, используя только код в spec файле жасмина?

Ответы

Ответ 1

Самое простое решение - добавить форму в DOM самостоятельно в предыдущем блоке, а затем удалить ее в следующем блоке:

describe(function(){
  var form;

  beforeEach(function(){
    form = $('<form>');
    $(document.body).append(form);
  });

  it('your test', function(){


  })

  afterEach(function(){
   form.remove();
   form = null;
  });
});

Также писать ваш помощник в виде песочницы не так сложно:

function sandbox(html){
  var el;

  beforeEach(function(){
    el = $(html);
    $(document.body).append(el);
  });


  afterEach(function(){
   el.remove();
   el = null;
});

Ответ 2

Другой подход - использовать жасминовый светильник

Концепция

Вот один из способов подумать:

В jQuery вы даете $() селектор CSS, и он находит элементы на DOM.

В жасмин-приспособлении вы даете аффикс() селектор CSS, и он добавляет те элементов в DOM.

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

Наконец, жасминовое крепление поможет вам избежать тестового загрязнения путем чистки и удалите все, что вы прикрепляете к DOM после запуска каждой спецификации.

См. также: SO: dom манипуляция в тесте Жасмин

Ответ 3

Вы должны использовать sandbox() для создания div и создания элемента формы и добавления в песочницу, это более безопасный способ использования jasmine для управления этими объектами в DOM.