⚠️ This lesson is retired and might contain outdated information.

Protractor Interactive

John Lindquist
InstructorJohn Lindquist
Share this video with your friends

Social Share Links

Send Tweet

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

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.