Installation

[MUSIC] 0:00 Okay, so let's get this party started. 0:04 Selenium-WebDriver has all sorts of client level APIs that let you use just about any 0:06 programming language that you can think of. 0:10 Now with that in mind, we decided to use JavaScript since you're driving a web 0:13 browser and JavaScript is the language of the web. 0:18 We figured, chances are you probably have some level of 0:21 experience with JavaScript, if you're here. 0:24 Now in order to get started, 0:26 we're going to need to make sure that you have Node installed. 0:28 If you've never used Node before, don't fear. 0:31 Node is a JavaScript run-time that allows you to write JavaScript applications and 0:33 run them locally as well as on a server. 0:36 Let's make sure that we've got everything installed. 0:38 All right, so I'm running on a Mac and I've got my terminal open here. 0:42 So let's see if I have Node installed. 0:46 So I'm gonna type, which node, and it turns out that I do. 0:48 On a PC you would type where node. 0:54 Now if you didn't find Node installed, check the teachers notes for 0:56 installation instructions. 0:59 I'm just gonna verify what version of Node I'm running, so I'm gonna have node- v, 1:01 and you'll see here that I'm running version 6.9.4. 1:04 As long as we're on version 6, and that's that first number here. 1:09 This is the major release, 6, or greater we'll be good to go. 1:13 If you aren't there, 1:17 get a newer versioned installed using the instructions in the teacher's notes. 1:18 Okay, so now I wanna make a directory or 1:21 folder to store the code that we'll be working on in this course. 1:24 I'm gonna call it Selenium basics. 1:27 I'm gonna say, mkdir selenium-basics. 1:28 And I'm gonna change to that directory. 1:32 So change directory, selenium-basics. 1:36 Okay, and since we have Node installed, we also have NPM. 1:39 NPM stands for the Node Package Manager and 1:43 it allows you to install Node based modules. 1:45 So, we want to install one of those open source modules, the one for Selenium. 1:48 So we'll type npm install selenium-webdriver. 1:52 It's gonna go and download that stuff and it's gonna give us some warnings. 2:00 And basically, these warnings are just because we haven't yet 2:04 made our folder a package. 2:06 But what it did do was install a bunch of Node modules, and 2:09 we can see those if we do ls. 2:13 We can list those files in the Node modules directory and 2:15 you'll see what was required to get Selenium up and running. 2:18 So now that we have the package installed, 2:22 we actually need to install the web driver, the browser specific web driver. 2:24 Let's start with the Chrome version. 2:28 So we'll install this globally, so you don't need to do it over and over again. 2:29 So we'll say, npm install chromedriver -g. 2:33 And that's going to install it globally. 2:37 And you need to have the right permissions. 2:40 I'm gonna show you what happens if you don't, and 2:42 then I'll show you how to fix it. 2:43 So see it says I don't have it. 2:47 It says, please try running this command as root administration. 2:48 So I'm just gonna do a sudo npm. 2:51 I'm gonna say, sudo which is basically will log 2:53 you in as an administrator to put that in there. 2:57 So, I will do that, put it as password. 3:01 There we go. 3:11 And so now that we've got it installed, 3:12 we can type chromedriver --version, just to make sure it's working. 3:13 Awesome. 3:19 In the course, 3:20 DOM Scripting By Example, there is an RSVP web application that's built. 3:21 Now, I've attached the workspace here. 3:26 Go ahead and launch that workspace. 3:28 So, this is what my workspace looks like. 3:30 I'm gonna go ahead and preview, and then I'm gonna click this 3:34 eye here to open up the preview, so it will launch the webpage for us. 3:37 And I'm gonna use this just a little bit so you can kinda see how things work. 3:42 So I'm gonna type, Nathan. 3:44 I'm gonna submit. 3:46 I'm also gonna add Elizabeth here. 3:48 There we go. 3:50 So you see that they start adding up. 3:52 And you can confirm or not confirm, or you can edit the person's name. 3:54 So add Nathan Menge. 3:57 So as you can see, there's a little bit of interactivity that's going on here, and 3:59 we can automate it. 4:02 What do you say we give it a try? 4:03 So what I'm gonna do is I'm gonna copy the URL. 4:05 Now, note here that this URL is pretty intense, 4:07 so yours is gonna look different than mine. 4:09 So I'm gonna copy that and I'm gonna flip back over to my terminal. 4:12 Node offers what is known as a REPL, or a read eval print loop. 4:16 It basically let's you build a program up as you go, and it's wonderful for 4:19 this sort of exploratory coding. 4:23 To start it, you just type Node. 4:25 So, first, we need to grab the module that we installed. 4:28 So this is just JavaScript here, right? 4:32 So I'm gonna do a const selenium, so this is the name of the package. 4:34 And we'll say, 4:37 require selenium-webdriver. 4:40 Okay, and the package lets you use the builder design 4:45 pattern to configure the driver that you exactly want. 4:50 You called build on the builder and it returns the right version. 4:53 Here, let's do it. 4:56 So I'll say const, we'll call our variable driver. 4:57 And we'll make a new selenium, lowercased, .Builder, okay? 5:00 This is the pattern here, so you describe what it is that you want. 5:06 For right now, we just wanna have Chrome, so we'll say, forBrowser, chrome. 5:10 And then after you've set up all of your options, you call build on it and 5:15 that's how the pattern works. 5:18 So we'll do build, all right. 5:19 And now, I am going to set up a URL and 5:22 then I'm gonna paste, and that's the Treehouse preview that was up from before. 5:26 Okay, so I'm gonna do driver.get, cuz that's how you go get the webpage, url. 5:32 And it put back a whole bunch of information, but 5:38 it should have also opened up a new RSVP app. 5:44 And you'll see it says that Chrome is being controlled by 5:49 automated test software. 5:52 And also, it's made a new Chrome instance. 5:53 So I have Chrome up and running, but it's a new Chrome one over here. 5:56 And that's nice [LAUGH] because as you start doing these, 5:58 they'll start opening more and more. 6:01 And you'll probably wanna know this because eventually you'll wanna close it, 6:03 so you say driver.close. 6:06 And then you'll see that it's gone. 6:11 And to get out of the REPL, you can press CTRL + D. 6:13 Now don't worry, the REPL does a great job of ruining what you just typed in, so 6:20 you won't need to type all that again. 6:23 Okay, why don't you take a quick break and come back here and 6:26 we'll get started learning the basics of how to manipulate these elements. 6:29