2013-12-19 3 views
1

У меня есть страница с текстом в разных HTML-элементах, и мне нужен быстрый способ проверки текста.проверка текста жасмина: как нормализовать текст?

Использование жасмина и жасмина-запроса для загрузки HTML и тестирования DOM.

Например, я хочу, чтобы проверить текст в этом HTML

<table id="users"> 
    <thead> 
     <tr> 
      <td>user</td> 
      <td>permissions</td> 
      <td>last seen</td> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td>Darren</td> 
      <td>testuser,customer</td> 
      <td>today</td> 
     </tr> 
     <tr> 
      <td>Hillary</td> 
      <td>administrator</td> 
      <td>yesterday</td> 
     </tr> 
    </tbody> 
</table> 

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

it('should find correct text in table', function() { 
     expect($('#users').find('tbody tr').first()).toContainText('Darren testuser,customer today'); 
     expect($('#users').find('tbody tr').last()).toContainText('Hillary administrator yesterday'); 

    }); 

Я эта неудача:

Testexample:: should find correct text in table: failed 
    Expected '<tr> 
       <td>Darren</td> 
       <td>testuser,customer</td> 
       <td>today</td> 
      </tr>' to contain text 'Darren testuser,customer today'. (1) 
    Expected '<tr> 
       <td>Hillary</td> 
       <td>administrator</td> 
       <td>yesterday</td> 
      </tr>' to contain text 'Hillary administrator yesterday'. (2) 
1 spec in 0.283s. 
>> 2 failures 

Другой эксперимент был использовать jQuery.text() для извлечения, то я до сих пор есть ошибка из-за все пробельные :

it('should find correct text in table with jQuery.text()', function() { 
     expect($('#users').find('tbody tr').first().text()).toContain('Darren testuser,customer today'); 
     expect($('#users').find('tbody tr').last().text() ).toContain('Hillary administrator yesterday'); 

    }); 

дает эту ошибку:

Testexample:: should find correct text in table with jQuery.text(): failed 
    Expected ' 
       Darren 
       testuser,customer 
       today 
      ' to contain 'Darren testuser,customer today'. (1) 
    Expected ' 
       Hillary 
       administrator 
       yesterday 
      ' to contain 'Hillary administrator yesterday'. (2) 
1 spec in 0.291s. 
>> 2 failures 

Capybara (для ruby) имеет способ нормализовать текст, чтобы всегда видеть разумное текстовое представление моего HTML. Как я мог бы нормализовать пробелы простым способом, чтобы я мог сделать такие проверки?

(Я не ожидаю таких ответов, как «вы не должны тестировать элементы html» ... так как это предпосылка для вопроса. На самом деле мне нравится делать утверждения по нескольким элементам: это читаемо, коротко и давать . быстрый просмотр, если материал работает также действительно необходимо, когда я тестирую снаружи в)

ответ

2

Благодаря ответу Тобиаса я в конечном итоге улучшил это и написал свой собственный пользовательский макет. Теперь я могу написать:

 expect($('#users').find('tbody tr').first()).toHaveNormalizedText('Darren testuser,customer today'); 

код Сличитель - добавили в beforeEach() блок моего описания() сценария:

 this.addMatchers({ 
      toHaveNormalizedText: function(expected) { 
       var actualText = $.trim(this.actual.text()).replace(/\s+/g, ' '); 
       var result = actualText === expected; 
       if(result) return result; 
       //rest is only if it fails 
       var notText = this.isNot ? " not" : ""; 
       var charcodes = []; 
       for(var i=0; i<actualText.length; i++){ 
        charcodes.push(actualText.charCodeAt(i)); 
        if(i>23) break; 
       } 
       this.message = function() {return 'Expected "' + actualText + notText + '" to match "'+expected+'"\n\nFirst 25 charcodes:\n'+charcodes;}; 
       return result; 
      } 
     }); 

Несколько замечаний по этому поводу. Вот фактическая замена:

$.trim(this.actual.text()).replace(/\s+/g, ' '); 

$ .trim() имеет важное значение для моей HTML структуры, которая сделала включать пробела в начале строки текста().

this.message = function() {return 'Expected "' + actualText + notText + '" to match "'+expected+'"\n\nFirst 25 charcodes:\n'+charcodes;}; 

this.message это сообщение об ошибке жасмина. Эта строка выводит строки как это по ошибке:

failed 
    Expected "Darren testuser,customer todaiiy" to match "Darren testuser,customer today" 

First 25 charcodes: 
68,97,114,114,101,110,32,116,101,115,116,117,115,101,114,44,99,117,115,116,111,109,101,114,32 (1) 

Я решил добавить charcodes, потому что в какой-то момент у меня была проблема с charcodes 10 (символ новой строки) и 32 (пробелы).

3

Я часто добавить что-то вроде этого, чтобы мои проекты:

String.prototype.normalizeSpace = function() { 
    return this.replace(/\s\s+/g, ' '); 
} 

Таким образом, после .text() вы можете просто добавить вызов .normalizeSpace()

+0

Я могу определенно использовать это. Конечно, я предпочел бы взять это немного дальше и обернуть его в специальный шаблон для жасмина –

1

Для Жасмин v2, я писал:

jasmine.addMatchers({ 
    toHaveTrimText: function() { 
    return { 
     compare: function(actual, expected) { 
     var actualText = $(actual).text().trim(); 
     var result = { 
      pass: actualText === expected, 
      message: 'Expected "' + actualText + '" to match "' + expected + '"' 
     } 
     return result; 
     } 
    } 
    } 
}); 

Я также использую https://github.com/velesin/jasmine-jquery.

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