Интеграционное тестирование
с использованием

SlimerJS

PayPS,  Петунин Владимир

Как вы тестируете проект
перед выкладкой на бой?

Руками?

Тестировщик?

Автоматические
тесты?

SlimerJS

Требования к тестовой среде

  1. Эмуляция действий пользователя
    • Переход на страницу
    • Клики по элементам
    • Заполнение формы, любые инпуты и кастомные элементы
    • Проверка результата

Популярные решения

Selenium

PhantomJS

SlimerJS

Быстрая установка и запуск

  1. Установили SlimerJS   (github /laurentj/slimerjs)
  2. Написали тест на javascript
  3. Запустили
    > slimerjs test.js --headless param1 param2

Гибкость SlimerJS

Пример теста

			var page = require('webpage').create();
			page.viewportSize = { width:650, height:320 };
			
				page
					.open('http://mypage.com') // загружаем страницу
			
			
					.then(() => { 
						page.sendEvent('click', x, y, 'left', modifier);
			
					page.sendEvent('keypress', 'A');
			
						page.render('page.png');
						slimer.exit();
				});
			
		

Настойка страницы

			page.onResourceRequested((requestData, request) => {});
			page.onResourceReceived((response) => {});
			page.onConsoleMessage((message, line, file) => {});
			page.onPrompt((question, defaultResponse) => "Answer");
			page.onFilePicker(() => "/path/to/file");
		

Выполнение javascript в контексте страницы

			var result = page.evaluate(() => document.getElementById('result'));
			
				expect.click = (page, selector) => {
					var coords = page.evaluate((selector) => {
						var element = document.querySelector(selector)	
						element.scrollIntoView();
						var rect = element.getBoundingClientRect();
						return rect;
					}, selector);
					page.sendEvent('click', coords.x, coords.y, 'left');
				}
			
		

Пример реального теста

			page.open('http://mysite.com/login')
			.then(() => expect.fill(page, '#login', 'admin'))
			.then(() => expect.fill(page, '#password', 'topsecret'))
			.then(() => expect.setOn(page, '#time', 'day'))
			.then(() => expect.click(page, '#submit'))
			.then(() => expect.waitFor(page, '#success'))
			
				.catch(error => {
					console.error(error);
					page.render('login.jpg');
					slimer.exit(-1);
				});
			
		
test

Спасибо за внимание!

Ваши вопросы?

SlimerJS

slimerjs.org

SlimerJS