Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add tutorial for Espresso UI tests #3

Merged
merged 4 commits into from
Jun 17, 2017
Merged

Conversation

matt-oakes
Copy link
Collaborator

I have added a tutorial which follows on from the cookie clicker introduction and introduces the idea of UI tests and Espresso.

I looked into covering the Espresso test recorded as discussed, but the code it generated didn't work, and I thought it wasn't worth introducing it and then saying that it's broken 😉

Copy link
Collaborator

@daniellevass daniellevass left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Really great tutorial. I've added a couple of points but you don't need to listen to them if you don't want. We'll make sure this is accepted and merged through before the big workshop on Saturday!

If you didn't work on that tutorial, or you don't have the code anymore, you can download a completed project to follow along with [here](downloads/cookie-clicker.zip). Download the file, unzip it and then open it with Android Studio using the *Open an existing Android Studio project* button on the welcome screen.

## What is UI testing?
To make sure your software works properly you need to test it whenever you make a change that you want to release to your users. For something like an app, you need to go through all the features of the app and make sure that nothing is broken. For even a small app this is a boring, repetitive, and time-consuming job. That's precisely the sort of thing which we use computers for! Automated tests are pieces of code which test that your software is working correctly for you.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe we could be more positive? Otherwise students won't see why writing tests is good! Writing good UI tests has a lot of really great benefits, like confidence in new features not breaking old features etc. You can make them run regularly, on many devices, many times?


We are going to write some UI tests for our cookie clicker app. A UI test is also known as a "functional test" as it is testing the functionality of the app. There are other types of tests such as "unit tests" which you may have come across in the Javascript, Ruby, or Python tutorials.

A UI test will take a set of instructions about what to click on and checks that the application responds correctly. They are doing the same as if you were clicking on and testing the app manually, but they can do it much quicker, and they don't get bored when they have to do it for the 100th time!
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

responds correctly = responds in an pre-determined layout. For example on a sign in screen, you might have an espresso test to check there's an error if you forget to enter a password when you click the login button?

testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
```

The complete file should look something like this (don't worry if yours has some extra bits):
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

maybe have the following as a screenshot so people don't accidentally copy and paste everything into their projects?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I've left this as text, but I've added a note above it reminding people not to copy and paste it all and not to worry if some bits are different.

}
```

Press the *Sync Now* button in the bar which has appeared along the top. If the bar disappears after syncing, then everything is set up correctly! If the bar shows and error message and a *Try Again* button then something has gone wrong. Take a look at the error at the bottom of the screen to see if you can fix it, or ask your coach for help.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

along the top might be a bit misleading? At the top of the window, under the play button, a golded orange bar has appeared? something like that?


This pattern of getting the view with a set of requirements and then checking something with it forms the basis of how Expresso tests work.

The completed test file should now look like this:
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

again, maybe consider using a screenshot? just so people don't copy paste it all and screw up package names etc?

Copy link
Collaborator Author

@matt-oakes matt-oakes Jun 14, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Again, I've added a note instead of a screenshot.

## Further information
You have now tested your cookie clicker app!

You can read more about Android testing using the links below:
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

really great informative tutorial (where were you 6 months ago when I learned espresso for the first time!!!!)

Maybe consider adding an extension task at the end? Something students could consider adding on their own? Maybe using a text field for their name (for a high score message) and checking if it's not empty? What do you think?

@matt-oakes
Copy link
Collaborator Author

@daniellevass Thanks for the comments! I've updated the tutorial with the changes you have suggested 👍

@matt-oakes matt-oakes merged commit 91ef330 into codebar:master Jun 17, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants