jasmine-jQuery, Как проверить заполнение формы и изменение элемента HTML?

Я пытаюсь проверить заполнение формы HTML и последующую смену HTML-элементов Text. Мне нужно создать некоторую форму события, используя жасмин-JQuery ...jasmine-jQuery, Как проверить заполнение формы и изменение элемента HTML?

HTML

<div class="response" id="text-response">Unknown</div> 
 

 
<div class="form-holder"> 
 
    <form> 
 
    <input id="input-text" type="text" name="user-input" placeholder="Test Your Text" value=""> 
 
    <input id="submit-button" type="submit" value="Submit"> 
 
    </form> 
 
</div>

Я пытаюсь проверить диск ID = 'текст-ответ' меняется на «Correct 'на основе некоторой логики сценария.

describe('Interface logic', function(){ 

     it('Will return correct if logic applies', function(){ 
     expect('#emotion').toContainText('Correct'); 
     }); 

    });

Любая помощь будет высоко ценится

источник

2015-04-24 Kieran Goodacre

$('#submit-button').click();

Был решение для меня, но постоянного обновления спецификации второго места, потому что вы удар http://localhost:3000/specs/ вместо http://localhost:3000/SpecRunner.html

источник

2015-05-08 19:50:44

Вы можете просто нужно, чтобы вызвать событие, например:

$('#submit-button').click();

Это должно сгореть событие щелчка. Затем вы можете проверить, не изменилось ли это событие на странице.

источник

2015-04-24 12:46:18 beautifulcoder

Это имеет смысл, хотя по какой-то причине, когда я использую '' '.click()' '', а не '' '.trigger()' '', это заставляет мой SpecRunner постоянно обновляться, я тестировал его с использованием как chrome, так и firefox, любых идей? –

Держу пари, что он уволил сообщение/перезагрузку страницы. Вы можете попробовать выполнить 'e.preventDefault()'. Это будет сохраняться на одной странице без серверной почты. – beautifulcoder

Если у вас есть форма HTML в отдельный шаблон в файле с именем, например

templates/form.tmpl.html

и ваш JQuery в отдельный файл и с именем, например

js/validation.js

и содержащий код проверки, как

$(".form-holder").on("submit", function() { 

    event.preventDefault(); 

    var userInput = $('#input-text').val(); 

    if (userInput === 'the correct text') { 
    $('#text-response').text('Correct'); 
    return; 
    } 

    $('#text-response').text('Incorrect'); 
});

Тогда ваш тестовый образец может быть чем-то подобным этому

describe('Interface logic', function() { 

    jasmine.getFixtures().fixturesPath = ''; 

    beforeEach(function() { 
     loadFixtures('templates/form.tmpl.html'); 
     appendSetFixtures('<script src="js/validation.js"></script>') 
    }); 

    it('Will return correct if logic applies', function(){ 
     $('#input-text').val('the correct text'); 
     $('#submit-button').trigger("click"); 
     expect($('#text-response').text()).toBe('Correct'); 
    }); 

    it('Will return incorrect if logic applies', function(){ 
     $('#input-text').val('the incorrect text'); 
     $('#submit-button').trigger("click"); 
     expect($('#text-response').text()).toBe('Incorrect'); 
    }); 

});

И спецификация бегун HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <title>Spec Runner</title> 

    <link rel="stylesheet" type="text/css" href="lib/jasmine-2.0.3/jasmine.css"> 
    <script type="text/javascript" src="lib/jasmine-2.0.3/jasmine.js"></script> 
    <script type="text/javascript" src="lib/jasmine-2.0.3/jasmine-html.js"></script> 
    <script src="lib/jasmine-2.2/boot.js"></script> 

    <script type="text/javascript" src="lib/jquery-2.1.3.min.js"></script> 
    <script type="text/javascript" src="lib/jasmine-jquery.js"></script> 

    <script type="text/javascript" src="specs/form.spec.js"></script> 
</head> 

<body> 
</body> 
</html>

источник

2015-04-25 12:04:16

Спасибо, но это все еще не работает, мне интересно, если это проблема с сервером, у меня есть сервер Node/Express, работающий так ... '' 'var express = require ('express'); var app = express(); var server = require ('http'). CreateServer (приложение); корень вар = __dirname + '/' app.use (express.static (корень)) app.get ('/ индекс', функция (REQ, разреш) { res.sendFile (корень + индекс. html '); }); app.get ('/ spec', function (req, res) { res.sendFile (root + 'SpecRunner.html'); }); сервер.listen (3000, функция() { консоль.log («Сервер, прослушивающий порт 3000»); }); module.exports = server; '' ' –

jasmine-jQuery, Как проверить заполнение формы и изменение элемента HTML?

ответ

Смежные вопросы