Тестирование css-регрессий с gemini – odessajs

60
Тестирование CSS-регрессий с gemini Сергей Татаринцев, Яндекс OdessaJS, 5-6 июля 2014

Upload: sevinf

Post on 26-May-2015

1.158 views

Category:

Software


6 download

TRANSCRIPT

  • 1. CSS- gemini , OdessaJS, 5-6 2014

2. 4 62 15 2 3. 3 4. 4 5. jscs 5 6. SS ??? 6 7. 7 8. ? 8 getComputedCss(block).borderWidth.should.be('2px') 9. 9 border box-shadow 10. ? 10 11. 11 12. , 12 13. 13 14. 14 15. 15 16. 16 17. 17 18. 18 19. 19 20. 20 21. 21 22. - 22 23. 23 24. bem-components 24 25. 25 26. 26 27. git checkout long-time-ago 27 28. 28 29. 29 30. DPXDT github.com/bslatkin/dpxdt URL 30 31. casper.js + phantom.css github.com/Huddle/PhantomCSS phantom.js 31 32. Huxley github.com/facebook/huxley 32 33. dpxdt phantom.css Huxley JavaScript 33 34. gemini opensource 34 35. 35 36. 1 2 N 36 37. plain hover pressed focused 37 38. var gemini = require('gemini'); ! gemini.suite('button', function(suite) { ! }); 38 39. URL ! suite.setUrl('/some/url'); 39 40. suite.setCaptureElements('.button'); 40 41. suite.capture('plain'); 41 42. suite.capture('hovered', function(actions) { ! }); 42 43. suite.capture('hovered', function(actions) { actions.mouseMove('.button'); }); 43 44. nd suite.capture('pressed', function(actions, find) { actions.mouseDown(find('.button')); }); 44 45. before suite.before(function(actions, find) { this.button = find('.button'); }); 45 46. var gemini = require('gemini'); ! gemini.suite('button', function() { suite.setUrl('/some/url') .setCaptureElements('.button') .before(function(actions, find) { this.button = find('.button'); }) .capture('plain') .capture('hovered', function(actions, find) { actions.mouseMove(this.button); }) .capture('pressed', function(actions, find) { actions.mouseDown(this.button); }) .capture('clicked', function(actions, find) { actions.mouseUp(this.button); }); 46 47. .gemini.yml rootUrl: http://example.com gridUrl: http://localhost:4444/wd/hub browsers: chrome33: browserName: chrome version: '33.0' opera12: browserName: opera version: '12.16' firefox25: browserName: firefox version: '25.0' ie9: browserName: internet explorer version: '9.0' 47 48. 48 49. 49 50. saucelabs.com 50 51. SAUCE_USERNAME= SAUCE_ACCESS_KEY= 51 52. .gemini.yml gridUrl: http://ondemand.saucelabs.com/wd/hub 52 53. SauceConnect saucelabs.com/docs/connect /bin/sc 53 54. travis-ci.org 54 55. TravisCI before_install: - sudo apt-get update -qq - sudo apt-get install -qq -y graphicsmagick .travis.yml 55 56. TravisCI "scripts": { "test": "gemini test" } package.json 56 57. SauceLabs + TravisCI saucelabs.com/opensource/travis : github.com/SevInf/OdessaJS-gemini 57 58. - 58 59. ? ru.bem.info/tools/testing/gemini/ ! github.com/bem/gemini 59 60. [email protected] @SevInf SevInf ! 60