#100DaysOfCode in Python Transcripts
Chapter: Days 73-75: Automate tasks with Selenium
Lecture: Demo 2: automating PyBites banner creation
0:00 All right, I got another cool project to show you Selenium in action. A while ago we made a banner generator with Pillow and Flask.
0:10 And you can read about that in this blog post. And, the thing was, as we were making banners repeatedly, we just made a little Flask app,
0:18 we enter some data, and it generates a banner. What if you can automate that using Selenium? So, again, it's pretty similar as last time.
0:28 We need to look into the site. Well this one is actually cooler because we are going to provide data in a form.
0:35 So we're actually going to submit this form doing a post request with some data, and then it will return our banner. Let's get that working.
0:43 Similar as last time, you need your login to be loaded from the environment. You don't want to hardcode that in your script.
0:50 So, in this case, already done that. So, I got my user and my password. I'm keeping secret here see the last video
0:57 how you load those into your environment, putting them into your virtual environment's activation script.
1:03 At this notebook I'm not going to do much validation, but you could add something like this. Class, no login. Extends exception. Pass exception.
1:19 And then, if user is None, or password is None, raise a no login... exception, and tell the user to set...
1:38 in your end. Right, so that's a little extra if it would be like a script you're going to run. But let's focus on Selenium again.
1:45 Here's the site. It's an app we host on the Heroku app and the route to the login page. Again we need to initialize web driver, Chrome.
1:59 We get to the login page and, again, this is pretty similar as last time. We need to look at the HTML. Let's actually do that.
2:12 Right, so we want to right-click here and go to inspect. There you see that this is an input field. And, the name is username.
2:26 And the name of the second field is password. And those are the fields you want to specify for Selenium to go find. So, try, find, element... by id...
2:42 username... and we want to send it my user... string. And the same for password with the difference that we need to send our password
3:02 and hit enter. Return. Running this opens the browser. It logs in and that's it. Next up, needing a little helper to create a title.
3:16 And if it's not core Selenium, I'm going to just paste it in. In this exercise I want to make a PyBites news banner
3:23 and they're typically of the format news, year, week. And to get a week, I use isocalendar. So, basically what this does is, it gets me news
3:34 and then the current year and the current week. The same for the variables. I'm going to copy them in. The news option corresponds to the dropdown.
3:44 So here we have a dropdown of different types of logos or banner types. So we have special, news, article and challenge.
3:50 And we want the news one, so we have to specify that in the script. So the news option is pybites-news. That's the literal option of that select box.
3:58 I defined the background image that will show up on the banner and we're going to call the banner from PyBites import news
4:06 to enter digest and we pass in the year and the week. Which is nice. We have strings that you can just embed your variables.
4:13 And now the actual Selenium coding. Driver. find_element_by_id. Going to find a name, oh that's this guy. We're going to send the get title
4:27 which is the function that this is actually stored at. Just pass it around. That's better. Then I'm going to find... element...
4:45 by xpath. I'm going to copy this over. It's a bit tricky. That's something I needed to work with select options.
5:02 So go find the select box called image URL one. And again, you can use the web tools to see what the actual HTML looks like.
5:13 So the select box is image on the score URL one. Go grab that one and take the option with the text news option and click it.
5:22 So an input field is easier, but a select box is actually two actions, right. You have to find it and click on the right option
5:30 to get that value, to get it selected. Compare that to, again, another input element where I can just say... send keys. It's just way easier, right?
5:47 And I send the banner text. So I'm sending that here. And finally, I want to set the background image to that beautiful snake we saw
5:57 and that field is called image_url2. I'm going to send that to keys background image. As it's the final one, I'm going to hit enter.
6:15 Alright, seems I didn't have year and week in the global scope, so let's define those quickly here. And look at that, the banner got created.
6:29 Let's show that once more. It logged in. Put all the data in the form and submitted it. And it created this banner all automatically.
6:40 And let's not forget to close the driver when we're done. And that closed my window. Okay, how cool is that, right?
6:50 A banner completely automated with Selenium. And I hope this gave you a taste of what you can do with Selenium
6:57 and let's review next what we've learned.