Building for Legacy Browsers - jQuery UK 2013

Transcript

1. Complex clientside apps and legacy
   browsers (a story of frustration) !
   @Joe8Bit  –  Friday  19th  of  Apr  2013  
   

   View Slide

2. View Slide

3. •  Frameworks and tools"
   

   View Slide

4. •  Frameworks and tools"
   •  Refining User Experience"
   

   View Slide

5. •  Frameworks and tools"
   •  Refining User Experience"
   •  The JScript JavaScript engine (and why I want to
   stab it with a fork)"
   

   View Slide

6. •  Frameworks and tools"
   •  Refining User Experience"
   •  The JScript JavaScript engine (and why I want to
   stab it with a fork)"
   •  Testing, testing and more testing"
   

   View Slide

7. •  Frameworks and tools"
   •  Refining User Experience"
   •  The JScript JavaScript engine (and why I want to
   stab it with a fork)"
   •  Testing, testing and more testing"
   •  The role of jQuery and other libraries"
   

   View Slide

8. View Slide

9. •  Frameworks and tools"
   •  Refining User Experience"
   •  The JScript JavaScript engine (and why I want to
   stab it with a fork)"
   •  Testing, testing and more testing"
   •  The role of jQuery and other libraries"
   

   View Slide

10. •  Frameworks and tools"
    •  Refining User Experience"
    •  The JScript JavaScript engine (and why I want to
    stab it with a fork)"
    •  Testing, testing and more testing"
    •  The role of jQuery and other libraries"
    

    View Slide

11. View Slide

12. View Slide

13. View Slide

14. View Slide

15. Part one: Testing"
    Joe  Pe:ersson  –  Friday  19th  of  Apr  2013  
    

    View Slide

16. Part one: Testing"
    •  Local testing and development environments"
    •  Distributed unit and integration testing"
    

    View Slide

17. Part one: Testing – Ruby, *nix et al"
    •  Ruby/Rails"
    •  *nix dev environment"
    

    View Slide

18. Two approaches…"
    Buy or Build!
    

    View Slide

19. Part one: Testing"
    Local testing and development environments!
    

    View Slide

20. View Slide

21. IE  VM’s  from  @xdissent  
    h:ps://github.com/xdissent/ievms  
    

    View Slide

22. PROTIP  
    Put  downloaded  raw  disk  images  in  ~/.ievms/    
    on  any  device  to  prevent  having  to  download  
    them  again  on  that  machine  
    

    View Slide

23. View Slide

24. View Slide

25. View Slide

26. Part one: Testing - Local testing and development environments

    "
    Pseudo-­‐distributed  browser  tesIng  with  Selenium  and  
    Virtual  Machines  !
    

    View Slide

27. “Selenium is a suite of tools to automate web browsers
    across many platforms.”"
    http://www.seleniumhq.org/!
    

    View Slide

28. View Slide

29. Starting stand alone Selenium in ‘hub’ mode:"
    $  java  -­‐jar  selenium-­‐server-­‐standalone.jar  -­‐role  hub    
    Starting stand alone Selenium in ‘hub’ mode:"
    $  java  -­‐jar  selenium-­‐server-­‐standalone.jar  -­‐role  
    webdriver  –hub  http://0.0.1.1    
    

    View Slide

30. Part one: Testing - Local testing and development environments

    "
    Pseudo-­‐distributed  browser  tesIng  with  Selenium  and  
    Virtual  Machines  !
    Running  Tests!
    

    View Slide

31. Not  an  official  project  logo.  But  it  should  be.  
    h:ps://github.com/jnicklas/capybara  
    

    View Slide

32. Configuring Capybara!
    

    View Slide

33. Integration tests take a while, especially when
    running them in multiple environments’ !
    Unfortunate truth!
    

    View Slide

34. Local  TesEng    
    

    View Slide

35. View Slide

36. Selenium  Jenkins  plugin  
    h:ps://wiki.jenkins-­‐ci.org/display/JENKINS/Selenium+Plugin    
    

    View Slide

37. ?"
    

    View Slide

38. So,  what  if  that  is  too  much  effort?  What  if  I  
    don’t  have  the  Eme  or  the  desire?  
    

    View Slide

39. View Slide

40. View Slide

41. •  Easy, fast setup"
    •  Loads of easy integrations "
    •  Scalability and parallelisation"
    •  Great support"
    

    View Slide

42. Integrating Saucelabs distributed testing in a Rails project !
    1.  Add jasmine-sauce to your Gemfile  
    2. bundle  install  
    3. bundle  exec  sauce  config  
    4. rails  generate  sauce:jasmine  
    5. rake  jasmine:ci:sauce  
    

    View Slide

43. View Slide

44. Part one: Testing"
    Joe  Pe:ersson  –  Friday  19th  of  Apr  2013  
    

    View Slide

45. “1.3.1  should  support  IE6  (we  dropped  our  IE  test  suite  awhile  ago  
    because  it  was  difficult  to  maintain,  and  we  lost  a  bit  of  insight  into  
    whether  or  not  IE6  would  run  without  errors).  I  think  we  dropped  IE6  
    support  in  the  upcoming  2.0  branch  as  IE6  has  been  EOLed.”  
     
    h:ps://github.com/pivotal/jasmine/issues/327    
    

    View Slide

46. Part two: The role of jQuery and other libraries"
    Joe  Pe:ersson  –  Friday  19th  of  Apr  2013  
    

    View Slide

47. View Slide

48. View Slide

49. View Slide

50. View Slide

51. Thanks!!
    

    View Slide

52. @Joe8bit!
    

    View Slide