Skip to content

How to Review Pull Requests

Qiqi Zheng edited this page Aug 4, 2021 · 1 revision
Table of Contents
Introduction
Different Ways of Leaving Feedback for a Collaborator
Step 0: Is the pull request done with the correct branch?
Step 1: Is there a linked issue?
Step 2: Understand the linked issue.
Step 3: View the changes in the browser.
Step 4: Take a look at the source code.
Step 5: Check for anything else.
Step 6: Approve the pull request.
Supplementary Materials
Checklist
GitHub Review Doc

Introduction

When multiple collaborators work on a project, changes are constantly made. Review process ensures the code from each pull request to be functional before merging into the production site. All pull requests require at least one reviewer's approval before squash and merge into the master.

The review process starts when a collaborator creates a pull request. A pull request requires a reviewer's examination and approval. As a reviewer, you need to ensure the changes are: 1) applicable, 2) does not break the application, and 3) clean (collectively know as the ABCs).

If the changes passes the ABC's, the pull request is approved for a squash and merge with the master. Otherwise, you, as the reviewer, must leave feedback for the collaborator.

Return to top

Different Ways of Leaving Feedback for a Collaborator

When changes fail to follow any of the ABC's, there are a couple of ways to leave feedback for the collaborator: leave a comment, request changes, or leave an inline comment. As required, all three can be done at once, but one will often suffice.

Leave a comment

This is usually reserved for clarification purposes. To leave a comment, go to the Files changed tab, if not already there. Then click the green button labeled, "Review Changes". In the pop-up, leave a comment, and be sure to select the "Comment" radio button before you submit. You can also use the @ shortcut to notify others to your comment.

Request changes

When changes fail at least one of the ABCs criteria, the best way to leave feedback is to request changes. As the name implies, when you request changes, you detail additional steps the collaborator must take before their changes passes the ABC's. To request changes from a collaborator, select the "Request Changes" radio button rather than "Comment" radio button. This flags the pull request, preventing merges until a reviewer approve the additional changes. When requesting changes, be sure that they are specific and actionable!

Leave an Inline Comment

When leaving a comment or requesting changes, you also have the option of commenting directly on the source code, through Github's line comments feature. If you have the time, I would encourage you to use inline comments as often as possible as they improve communication between reviewer and collaborator and minimize development time.

Return to top

Step 0: Is the pull request done with the correct branch?

Before anything else, check that the pull request contains the correct branch. In other words, it must pass the following two checks:

  • The commit into must be "hackforla/lucky-parking"
  • The commit from must be from the collaborator who opened the pulled request

If neither of the two criteria are met, then the collaborator might have made a mistake when making their pull request. Leave a comment stating that they have made the request with the incorrect branch and to redo the pull request with the correct branch.

Return to top

Step 1: Is there a linked issue?

Every pull request comes with a post by the collaborator. Usually, a post contains: 1) a linked issue, 2) comments on the changes, and 3) screenshots of the changes. For this step, we will focus on the linked issue.

When a collaborator make changes, they implement them based on issues with the application. These issues are outlined in a separate post called a linked issue. Therefore, the linked issue provides important context that frames the collaborator's changes. Without it, there would be no way to tell whether changes are applicable!

Linked issues are usually in a Word #number (or in regex: [A-Za-z]* #\d*) format. They always link to a different post. Here are some, but not all, examples of a properly-formatted linked issue: Fixes #20, Fixed #130, Resolves #136, Closes #220.

If the linked issue is not in the correct format, the review can still proceed, but do leave a comment on how to properly add a linked issue. However, if the linked issue is missing, the review cannot proceed. Leave a comment for the collaborator to add a linked issue.

As an aside, we also ask that collaborators include before and after screenshots of their changes as part of the post. These images are there to help visualize the changes. If the images are not there, please gently remind the collaborator to include images before continuing with Step 2 of the review.

Return to top

Step 2: Understand the linked issue.

Before a reviewer can understand the collaborator's changes, they must first have an firm grasp on the linked issue. Visit the linked issue. Read the post and the comments below, visit all relevant links, and click on any dropdowns. Approach the issue with the goal of understanding the issue, so that, later, you may accurately assess the collaborator's changes.

A good way to test your understanding is to restate or summarize the issue in your own words (or to your rubber duck, if desired). This helps in finding gaps to your knowledge and prevents you from blindly reviewing changes you might not firmly understanding.

If after reading the linked issue, you find yourself confused, do not panic! This can arise from unclear wording, or unfamiliar jargon. At this point you have several options:

  1. Research some of the unclear terms on your own
  2. Consult the person who brought up the issue (through a comment or our slack)
  3. Or, call on someone with more expertise (such as the person who wrote the issue) to review the issue with you

Return to top

Step 3: View the changes in the browser.

The easiest way to view the collaborator's changes is to see them for yourself! Outlined below are steps to download the collaborator's branch into your own version of the application.

Commandline instructions for Development Team

Type in these two commands into the repository, filling in for the variables inside of square brackets([ ]).

git checkout -b [nameOfCollaborator]-[nameOfFromBranch] [nameOfIntoBranch]
git pull https://github.com/[nameOfCollaborator]/lucky-parking.git [nameOfFromBranch]

Once the branch is installed, run the application and view it in the browser. You will also want to open our live site in a new tab. Locate the collaborator's changes on both sites and consider whether these changes address the issue. Some important questions to ask are:

  1. Are the changes applicable to the issue?
  2. Are there changes beyond those applicable to the issue?
  3. Does the application appear less user-friendly?
  4. Do the links and components on the page still work as intended?

In addition to viewing changes on your desktop browser, you must also assess these changes in multiple viewports (such as mobile or tablet), through your browser's developer mode.

Links to developer mode documentation in popular browsers (bookmark this for future reference 😊)
  1. Google Chrome
  2. Microsoft Edge
  3. Mozilla Firefox

After viewing these changes in your browser, you might discover that the changes are not applicable or breaks the application. In that case, you must request changes, and detail what exactly went wrong. If everything seems fine, you may proceed to Step 4.

Return to top

Step 4: Take a look at the source code.

At this step, you assess whether the changes are applicable and clean. Click the Files changed tab on the pull request page and examine the code. Green highlights (or lines with a plus sign) represent additions to the base code while red (or lines with a - sign) are deletions. Although clean is a subjective term, do make sure that the changes follow typical coding style guidelines. Good questions to ask are:

  1. Can the changes be condensed?
  2. Can the collaborator add comments to clarify any complex changes made?
  3. Are there any drastic changes that seems like they do not belong?
  4. Are there changes that are missing?

If something about the code is off, leave an inline comment and request changes.

Return to top

Step 5: Check for anything else.

After viewing the changes in your browser and in the source code, the changes might still appear inadequate, erroneous, or incomplete. For example, the changes might have created an entirely new, unforeseen issue. Or there might have been a mistake in the original issue's wording which the collaborator did not caught. In such cases, leave a comment to discuss with the creator of the issue about your concerns. In some cases, you might also want the creator of the issue to review the pull request with you. Open the image below to see how to add them as a reviewer.

Return to top

Step 6: Approve the pull request.

If after going through all the steps, and you find all the changes passes the ABC's, then congratulations! We are ready to approve of these changes. To approve, visit the Files changed tab and click the green "Review changes" button on the top right. Select "Approve" and leave something nice for the collaborator. Something as simple as a, "Great job! I love what you have done, insert name!", will really make someone's day.

Return to top

Checklist

  • Step 0: Is the pull request done with the correct branch?
  • Step 1: Is there a linked issue?
  • Step 2: Understand the linked issue.
  • Step 3: View the changes in the browser.
  • Step 4: Take a look at files changed tab.
  • Step 5: Check for anything else.
  • Step 6: Approve the pull request.

GitHub Review Doc

Return to top

Home

Click the arrow below each category to view links (or view original alphabetical list by clicking "Pages" above) :

Research and Discovery

Research and Discovery Overview

Research up to Dec 31, 2022
Research after Jan 1, 2023

Onboarding Guides

Lucky Parking Product Journey
UX Researchers' Guides
UI Designers' Guides
Data Scientists' Guide
Developers' Guides
Product Managers' Guides

Offboarding

Handing over responsibilities
Clone this wiki locally