This Lesson is for Members

Subscribe today and get access to all lessons! Plus direct HD download for offline use, enhances transcripts, member comment forums, and iTunes "podcast" RSS feed. Level up your skills now!

Unlock This Lesson

Already subscribed? Sign In

Autoplay
    This lesson is outdated. Click here to find out about changes you should be aware of.

    Protractor Interactive

    John LindquistJohn Lindquist

    Did you know that Protractor has a handy interactive mode to help with writing/debugging your end-to-end (e2e) tests?

    Code

    Code

    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson
    Transcript

    Transcript

    Man: 00:00 A great way to play around with protractor is to use the interactive element explorer. I have this tiny project here where if I click this button, it changes this to updated, and if I type "please," it shows this alert that says, "You know the magic word." Let's use the interactive explorer to play with this.

    00:17 To open the element explorer we need to run node against the element explorer, which is found in the protractor directory. If you just either navigate to the directory, which is in local lib node modules protractor, and then just say node/bin, element explorer. I'm going to go ahead and run it against this URL here, which you can see is this one right here, and hit enter.

    00:41 We are now in an interactive mode. It launched a new browser for us so we can go ahead and start getting things. If you just start hitting tab, it can show you a list of what you can do. I'm going to say element by tag name, and I'm going to see if this button can be found, and I found it. I'll go ahead and give it a name of button, and I can say button.

    01:04 Let's say button.click, and run that, and you can see that it clicked the button and updated the text.

    01:13 Now we can find the input so I can say element, again, element by, we'll do it by model this time, and say, I know it's named model message. It found it, so I can go ahead and assign that to input. When I say input clear, it should clear out the text. Then input send keys, and I want to send please, and hit enter. You can see it finds that alert.

    Discuss

    Discuss