Where can I learn every nook and cranny about jasmine, immediately?

testing
1

Hey folks,

I pushed something to production for a client that caused a few issues (nothing serious), but it’s something I think some good ol’ testing would’ve caught (some invisible divs were blocking a button).

I want to install sanjo:jasmine and get up to speed on this, like yesterday. I just don’t have the luxury of spending a week learning TDD (I’ve never really used it before, coming from an old-school dev background). A couple tutorials would be cool, but I’d also need a complete 100% reference to every single method, assertion, all syntax, all WebDriver (or whatever headless browser Jasmine uses) usage so I know how to simulate clicks, keypresses, and so on.

In summary: need to be up to speed on this today. :slight_smile: Any help would be greatly appreciated!

EDIT: Oh, eventually I’ll be doing all my work in Meteor + React, but for now, my testing solution also needs to work with traditional Blaze.

2

Hey unfortunately I don’t think Jasmine testing would solve that particular problem - these tests usually involve targeting specific elements on the page, and don’t detect whether they are covered by something else. You would need to run a test where something actually simulates a mouse click on a particular area of the screen, or something like Rainforest where a real human does it.

1 Like
3

Ahh I see. So you’re saying, while I could simulate a click on an element, it would click it regardless of whether it’s hidden, or blocked, etc. Makes sense.

4

You can try running velocity cucumber, which allow you to do such integration test with webdriver, but it’s a little rough on the edges (like everything velocity…).

5

Sashko is correct, as far as I’m aware. Jasmine is primarily a unit-testing framework. If you’re wanting to click around on a page and simulate user experience, you need an acceptance testing framework that uses Webdriver.io. There’s a couple out there, most notably xolvio:cucumber which runs on Velocity, and Nightwatch which runs on StarryNight.

Cucumber has the most beginner and business exec friendly syntax; whereas Nightwatch/StarryNight has probably the more comprehensive documentation. If you want to get up-and-running with doing acceptance testing fast, and have lots of documentation available, here’s what I recommend to businesses interested in FDA regulatory certification:

http://starrynight.meteor.com/examples/testing-quickstart
http://starrynight.meteor.com/testing

Edit: Was doing a bit of googling. Apparently maybe there is a Jasmine/Webdriver.io integration out there. Not sure if the sanjo:jasmine package supports it though.

6

Ahh, gotcha. So that’s how Jasmine differs from Cucumber. That explains why Jasmine is a good fit for React, which is all component-based.

I suppose there are no shortcuts, eh? :slight_smile: I’ve already purchased access to the Meteor Testing Manual. I’ll go take another look through that.

I’ll check out those links, @awatson1978 - thanks!

7

I don’t know of a complete reference but this tutorial is really good… albeit old, outdated, and using Jasmine 1.0. At the least reading it will help fill in the gaps:

The docs are pretty decent as well:
http://jasmine.github.io/2.0/introduction.html


[quote="ffxsam, post:1, topic:8874"] but it's something I think some good ol' testing would've caught (some invisible divs were blocking a button). [/quote]

When I use Meteor Capybara it fails when a div is overlapping the element the webdriver is clicking on. Not sure if it would catch this use case (it sounds like it may).

This acceptance testing suite works on any stack but uses Ruby and Rspec so that may be a non-starter.
https://learn.thoughtbot.com/test-driven-rails-resources/capybara.pdf

1 Like
8

Thanks Adam! I’ll also be checking out the write-up you did on testing Meteor+React.

9

Xolv.io will soon allow jasmine to also run the same end-to-end capability that cucumber current has.

I think some clarification is needed on Cucumber / Nightwatch / Jasmine+Webdriver.

Cucumber is not just a testing tool. It allows you to write Specification by Example. That is, the specs you write are executable. This means you write plain English (or other languages) document called a feature file, and you use the Gherkin syntax to write a story that has narrative and scenarios. The intent behind cucumber is to create specifications for a system that tell you WHY the system is supposed to do. Cucumber is the intersection between requirements, documentation and testing. It wraps your entire process from the moment you start a specification to the point you run it on your CI server. This diagram here illustrates this concept:

https://inapp.com/wp-content/uploads/2014/12/cucumber.png

This tooling supports a process called Behaviour Driven Development. If you want to have a BDD practice within your company of technical and non technical people, then Cucumber is the right tool for you. The benefits of doing BDD in a company are far greater than just testing.

Other frameworks like sanjo:jasmine + xolvio:webdriver or Nightwatch provide you with end-to-end testing. It’s possible to make them use a BDD-like syntax but they were not built from the ground up to support a BDD process. When you write test scripts, they typically hide away WHY a system and focus on only the HOW. Here’s an example:

Click('#login')
Type('#username', 'jon')
Type('#password', 'pa55word')
Click('#submit')

Type('#search', 'pencil')
Click('#one-click-checkout')

Expect('#item-price', '$1')
Expect('#message', 'Congratulations, you bought a pencil!')

This tells you HOW the user buys for s pencil but not WHY. If you read:

Scenario: Special customers receive a 90% discount
  Given Jon has logged in
  When he orders a pencil worth $10
  Then he is charged $1
  And he is sent a pencil

The automation for the steps above would be the same for Cucumber in the automation layer as the test script, but the scenario has provided a lot more context for business and technical people to see.

Hope that helps you decide what’s best for you :slight_smile:

3 Likes