---
id: 663d18c574456976d11b6e87
title: Step 2
challengeType: 0
dashedName: step-2
---

# --description--

In the game, there will be multiple rounds. The first to reach three points wins the game.

In this step, you will focus on determining if the player has won the round.

Complete the `hasPlayerWonTheRound` function. This function has two parameters: `player` and `computer`. The function should return `true` if the player has won the round, and `false` if the player has lost or tied the round.

Here are the criteria for the player to win a round:

- If the player chooses `"Rock"` and the computer chooses `"Scissors"`
- If the player chooses `"Scissors"` and the computer chooses `"Paper"`
- If the player chooses `"Paper"` and the computer chooses `"Rock"`

A few function calls have been provided for you to test your function.

# --hints--

Your `hasPlayerWonTheRound` function should return a boolean.

```js
assert.isBoolean(hasPlayerWonTheRound("Rock", "Scissors"));
```

Your `hasPlayerWonTheRound` function should return `true` if the player chose `"Rock"` and the computer chose `"Scissors"`.

```js
assert.isTrue(hasPlayerWonTheRound("Rock", "Scissors"));
```

Your `hasPlayerWonTheRound` function should return `true` if the player chose `"Scissors"` and the computer chose `"Paper"`.

```js
assert.isTrue(hasPlayerWonTheRound("Scissors", "Paper"));
```

Your `hasPlayerWonTheRound` function should return `true` if the player chose `"Paper"` and the computer chose `"Rock"`.

```js
assert.isTrue(hasPlayerWonTheRound("Paper", "Rock"));
```

Your `hasPlayerWonTheRound` function should return `false` if the player and computer chose the same option.

```js
assert.isFalse(hasPlayerWonTheRound("Rock", "Rock"));
assert.isFalse(hasPlayerWonTheRound("Scissors", "Scissors"));
assert.isFalse(hasPlayerWonTheRound("Paper", "Paper"));
```

Your `hasPlayerWonTheRound` function should return `false` if the computer won the round.

```js
assert.isFalse(hasPlayerWonTheRound("Scissors", "Rock"));
assert.isFalse(hasPlayerWonTheRound("Paper", "Scissors"));
assert.isFalse(hasPlayerWonTheRound("Rock", "Paper"));
```

# --seed--

## --seed-contents--

```html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Rock, Paper, Scissors game</title>
    <link rel="stylesheet" href="./styles.css" />
  </head>
  <body>
    <h1>Let's play Rock, Paper, Scissors!</h1>
    <main>
      <details class="rules-container">
        <summary>Rules to the game</summary>

        <p>You will be playing against the computer.</p>
        <p>You can choose between Rock, Paper, and Scissors.</p>
        <p>The first one to three points wins.</p>

        <p>Here are the rules to getting a point in the game:</p>
        <ul>
          <li>Rock beats Scissors</li>
          <li>Scissors beats Paper</li>
          <li>Paper beats Rock</li>
        </ul>
        <p>
          If the player and computer choose the same option (Ex. Paper and
          Paper), then no one gets the point.
        </p>
      </details>

      <div class="score-container">
        <strong
          >Player Score: <span class="score" id="player-score">0</span></strong
        >
        <strong
          >Computer Score:
          <span class="score" id="computer-score">0</span></strong
        >
      </div>

      <section class="options-container">
        <h2>Choose an option:</h2>
        <div class="btn-container">
          <button id="rock-btn" class="btn">Rock</button>
          <button id="paper-btn" class="btn">Paper</button>
          <button id="scissors-btn" class="btn">Scissors</button>
        </div>
      </section>

      <div class="results-container">
        <p id="results-msg"></p>
        <p id="winner-msg"></p>
        <button class="btn" id="reset-game-btn">Play again?</button>
      </div>
    </main>
    <script src="./script.js"></script>
  </body>
</html>

```

```css
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

:root {
  --very-dark-blue: #0a0a23;
  --white: #ffffff;
  --yellow: #f1be32;
  --golden-yellow: #feac32;
}

body {
  background-color: var(--very-dark-blue);
  text-align: center;
  color: var(--white);
}

h1 {
  margin: 15px 0 20px;
}

.btn {
  cursor: pointer;
  width: 100px;
  margin: 10px;
  color: var(--very-dark-blue);
  background-color: var(--golden-yellow);
  background-image: linear-gradient(#fecc4c, #ffac33);
  border-color: var(--golden-yellow);
  border-width: 3px;
}

.btn:hover {
  background-image: linear-gradient(#ffcc4c, #f89808);
}

.rules-container {
  padding: 10px 0;
  margin: auto;
  border-radius: 15px;
  border: 5px solid var(--yellow);
  background-color: var(--white);
  color: var(--very-dark-blue);
}

.rules-container ul {
  list-style-type: none;
}

.rules-container p {
  margin: 10px 0;
}

@media (min-width: 760px) {
  .rules-container {
    width: 60%;
  }
}

.score-container {
  display: flex;
  justify-content: space-around;
  margin: 30px 0;
  font-size: 1.2rem;
}

.score {
  font-weight: 500;
}

.results-container {
  font-size: 1.3rem;
  margin: 15px 0;
}

#winner-msg {
  margin-top: 25px;
}

#reset-game-btn {
  display: none;
  margin: 20px auto;
}

```

```js
function getRandomComputerResult() {
  const options = ["Rock", "Paper", "Scissors"];
  const randomIndex = Math.floor(Math.random() * options.length);
  return options[randomIndex];
}

--fcc-editable-region--
function hasPlayerWonTheRound(player, computer) {
  
}

console.log(hasPlayerWonTheRound("Rock", "Scissors")); 
console.log(hasPlayerWonTheRound("Scissors", "Rock")); 
--fcc-editable-region--
```
