freeCodeCamp/part-04.md at dae411d408d69266830402e87181a80f1f9c3cbc

lmilliken 39b0afd5f0 feat: tests for calorie counter

2020-09-16 11:54:00 +05:30

2.6 KiB

Raw Blame History

id, title, challengeType, isBeta

id	title	challengeType	isBeta
5ddb965c65d27e1512d44d9d	Part 04	0	true

Description

Create the calculate function that will hold the code to sum up the user's calorie inputs. Leave the body blank for now. Here is an example of an empty function called square:

function square() {}

Instructions

Tests

tests:
  - text: See description above for instructions.
    testString: assert( typeof calculate === "function" );

Challenge Seed

<script>
  document.getElementById('calorie-form').onsubmit = calculate;
</script>

Before Test

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title></title>
    <meta name="description" content="" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="stylesheet" href="styles.css" />
  </head>
  <body>
    <div class="container">
      <form id="calorie-form">
        <h2 class="center">Calorie Counter</h2>
        <div class="grid">
          <legend>Sex</legend>
          <div>
            <input type="radio" name="sex" id="female" value="F" checked />
            <label for="female">
              Female (2,000 calories)
            </label>

            <div>
              <input type="radio" name="sex" id="male" value="M" />
              <label for="male">
                Male (2,500 calories)
              </label>
            </div>
          </div>
        </div>
        <div class="grid" id="entries">
          Breakfast
          <input
            type="number"
            min="0"
            class="cal-control"
            id="breakfast"
          /><br />
          Lunch
          <input type="number" min="0" class="cal-control" id="lunch" /><br />
          Dinner <input type="number" min="0" class="cal-control" id="dinner" />
        </div>
        <button type="button" class="btn-add" id="add">
          Add Entry
        </button>
        <button type="submit" class="btn-solid" id="calculate">
          Calculate
        </button>
        <button type="button" class="btn-outline" id="clear">
          Clear
        </button>
      </form>
      <div id="output"></div>
    </div>
  </body>
</html>

After Test

  </body>
</html>

Solution

<script>
  document.getElementById('calorie-form').onsubmit = calculate;

  function calculate() {}
</script>

2.6 KiB Raw Blame History