Codecademy export

index.handlebars

  <div class="banner">
    <h1>CAKE BAR</h1>
  </div>

  <div class="body-container">
    <div class="menu">
      <form id="cake-form" action="/place-order" method="post">
        <div class="form-container">
          <div class="form-row">
            <h2>Enter your name</h2>
          </div>

          <div class="form-row">
            <div class="name-flex">
              <div class="name-col-1">
                <input type="text" id="name" name="name" value="">
              </div>
            </div>
          </div>

          <div class="form-row">
            <h2>Pick a cake type</h2>
          </div>

          <div class="form-row">
            <div class="input-col">
              <label for="plain">
                <input type="radio" id="plain" name="cakeType" value="Plain">Plain<br>
              </label>
            </div>
            <div class="input-col">
              <label for="whole-wheat">
                <input type="radio" id="whole-wheat" name="cakeType" value="Whole Wheat">Whole Wheat<br>
              </label>
            </div>
          </div>

          <div class="form-row">
            <h2>Add fillings</h2>
          </div>

          <div class="form-row">
            <div class="input-col">
              <label for="strawberries">
                <input type="checkbox" id="strawberries" name="fillings" value="Strawberries">Strawberries<br>
              </label>
              <label for="blueberries">
                <input type="checkbox" id="blueberries" name="fillings" value="Blueberries">Blueberries<br>
              </label>
              <label for="banana">
                <input type="checkbox" id="banana" name="fillings" value="Banana">Banana<br>
              </label>
              <label for="apple">
                <input type="checkbox" id="apple" name="fillings" value="Apple">Apple<br>
              </label>
            </div>
            <div class="input-col">
              <label for="macadamia-nuts">
                <input type="checkbox" id="macadamia-nuts" name="fillings" value="Macadamia Nuts">Macadamia Nuts<br>
              </label>
              <label for="sprinkles">
                <input type="checkbox" id="sprinkles" name="fillings" value="Sprinkles">Sprinkles<br>
              </label>
              <label for="chocolate-chips">
                <input type="checkbox" id="chocolate-chips" name="fillings" value="Chocolate Chips">Chocolate chips<br>
              </label>
              <label for="bacon">
                <input type="checkbox" id="bacon" name="fillings" value="Bacon">Bacon<br>
              </label>
            </div>
          </div>

          <div class="form-row">
            <div class="input-col">
              <h2>Choose a size</h2>
            </div>
            <div class="input-col">
              <h2>Set a pick up</h2>
            </div>
          </div>

          <div class="form-row select-row">
            <div class="select-col">
              <div class="styled-select">
                <select id="select-stack" name="size">
                  <option id="single" value="1">Single Stack</option>
                  <option id="double" value="2">Double Stack</option>
                  <option id="triple" value="3">Triple Stack</option>
                  <option id="quadruple" value="4">Quadruple Stack</option>
                  <option id="quintuple" value="5">Quintuple Stack</option>
                  <option id="sextuple" value="6">Sextuple Stack</option>
                  <option id="septuple" value="7">Septuple Stack</option>
                  <option id="octuple" value="8">Octuple Stack</option>
                  <option id="nonuple" value="9">Nonuple Stack</option>
                  <option id="decuple" value="10">Decuple Stack</option>
                  <option id="centuple" value="100">Centuple Stack</option>
                </select>
              </div>
            </div>
            <div class="select-col">
              <div class="styled-select">
                <select id="select-pickUp" name="pickUp">
                  <option id="8:00" value="8:00">8:00</option>
                  <option id="9:00" value="9:00">9:00</option>
                  <option id="10:00" value="10:00">10:00</option>
                  <option id="11:00" value="11:00">11:00</option>
                  <option id="12:00" value="12:00">12:00</option>
                </select>
              </div>
            </div>
          </div>

          <div class="form-row place-order-div">
            <input class="button" id="submit-order" type="submit" value="Place order">
          </div>
        </div>
      </form>

      <form action="/clear-order" method="post">
        <div class="form-container">
          <div class="form-row place-order-div">
            <input class="button" id="clear-order" type="submit" value="Clear">
          </div>
        </div>
      </form>
    </div>

    <div class="order">
      <h2 id="deliver-to">deliver to: <span>{{order.name}}</span></h2>
      <h2 id="cake-type">cake: <span>{{order.cakeType}}</span></h2>
      <h2 id="fillings">fillings: <span>{{order.fillings}}</span></h2>
      <h2 id="size">pancake count: <span>{{order.size}}</span></h2>
      <!-- Fix the header below -->
      <h2 id="pickUp">pick up time: <span>{{order.pickUp}}</span></h2>
    </div>
  </div>

order-test.js

const Order = require('../../models/order');
const {assert} = require('chai');
const {mongoose, databaseUrl, options} = require('../../database');

describe('Order', () => {
  beforeEach(async () => {
    await mongoose.connect(databaseUrl, options);
    await mongoose.connection.db.dropDatabase();
  });

  afterEach(async () => {
    await mongoose.disconnect();
  });

  describe('.updateOrCreate', () => {
    describe('when a record already exists', () =>{
      it('updates the record', async () => {
        const partialOrder = {
          name: 'Regular Joe',
          cakeType: 'Plain',
          size: '2',
          pickUp: '9:00',
        };
        const update = ['Apple', 'Bacon', 'Chocolate Chips'];
        const existingOrder = await Order.create(partialOrder);

        const updatedOrder = await Order.updateOrCreate({fillings: update});

        const allOrders = await Order.find({});
        assert.equal(allOrders.length, 1);
        // toObject resolves issues with mongoose metadata in arrays
        assert.deepEqual(updatedOrder.fillings.toObject(), update);
        // check remaining fields
        assert.include(updatedOrder, partialOrder);
      });
    });

    describe('when a record does not exist', () =>{
      it('creates the record', async () => {
        let healthyOrder = {
          name: 'Healthy Person',
          cakeType: 'Whole Wheat',
          fillings: ['Macadamia Nuts'],
          size: '1',
          pickUp: '11:00',
        }

        const order = await Order.updateOrCreate(healthyOrder);

        const allOrders = await Order.find({});
        assert.equal(allOrders.length, 1);
        assert.deepEqual(allOrders[0].fillings.toObject(), healthyOrder.fillings);
        delete healthyOrder.fillings;
        assert.include(allOrders[0], healthyOrder);
      });
    });
  });

  describe('#cakeType', () => {
    it('is a String', () => {
      const nameAsAnInt = 1;

      const order = new Order({ cakeType: nameAsAnInt });

      assert.strictEqual(order.cakeType, nameAsAnInt.toString());
    });
  });

  describe('#name', () => {
    it('is a String', () => {
      const nameAsAnInt = 1;

      const order = new Order({ name: nameAsAnInt });

      assert.strictEqual(order.name, nameAsAnInt.toString());
    });
  });

  describe('#fillings', () => {
    it('is an Array', () => {
      const fillings = ['Apple', 'Bacon'];

      const order = new Order({fillings});

      // toObject resolves issues with mongoose metadata
      assert.deepEqual(order.fillings.toObject(), fillings);
    });
  });

  describe('#size', () => {
    it('is a String', () => {
      const sizeAsAnInt = 3;

      const order = new Order({size: sizeAsAnInt});

      assert.strictEqual(order.size, sizeAsAnInt.toString());
    });
  });


});

order.js

const mongoose = require('mongoose');

const orderSchema = mongoose.Schema({
  cakeType: { type: String },
  name: { type: String },
  fillings: { type: [] },
  size: { type: String },
  pickUp: { 
    type: String,
  }
});

orderSchema.statics.updateOrCreate = async function(attributes, callback) {
  const firstOrder = await this.findOne({});

  if (firstOrder) {
    firstOrder.name = attributes.name || firstOrder.name;
    firstOrder.cakeType = attributes.cakeType || firstOrder.cakeType;
    firstOrder.fillings = attributes.fillings || firstOrder.fillings;
    firstOrder.size = attributes.size || firstOrder.size;
    firstOrder.pickUp = attributes.pickUp || firstOrder.pickUp;
    return firstOrder.save(callback);
  } else {
    return this.create(attributes, callback);
  }
};

module.exports = mongoose.model('Order', orderSchema);

user-visits-index-test.js

const {assert} = require('chai');
const {jsdom} = require('jsdom');

const parseTextFromHTML = (htmlAsString, selector) => {
  const selectedElement = jsdom(htmlAsString).querySelector(selector);
  if (selectedElement !== null) {
    return selectedElement.textContent;
  } else {
    throw new Error(`No element with selector ${selector} found in HTML string`);
  }
};

describe('User visits index', () => {
  describe('to post an order', () => {
    it('starts with a blank order', () => {
      browser.url('/');

      assert.equal(browser.getText('#deliver-to span'), '');
      assert.equal(browser.getText('#cake-type span'), '');
      assert.equal(browser.getText('#fillings span'), '');
      assert.equal(browser.getText('#size span'), '');
    });

    it('provides options within working hours only', () => {
      const hrTooEarly = '7:00';
      const hrTooLate = '13:00';
      
      browser.url('/');
      const bodyHtml = browser.getHTML('body');
      const parsedHtml = parseTextFromHTML(bodyHtml, '#select-pickUp');

      assert.notInclude(parsedHtml, hrTooEarly);
      assert.notInclude(parsedHtml, hrTooLate);

    })

    it('displays the selected pick up time properly', () => {
      const hour = "9:00";
      browser.url('/');
      browser.selectByVisibleText('#select-pickUp', hour);
      browser.click('#submit-order');
      
      browser.url('/');
      const pickupTime = browser.getText('#pickUp');
      assert.include(pickupTime, hour);
    })

    // Add the 'labels the pick up hour' test here
    it('labels the pick up hour correctly', ()=>{
      const label = 'pick up time:';
      
      browser.url('/');
      const bodyHtml = browser.getHTML('body');
      const parsedHtml = parseTextFromHTML(bodyHtml, '#pickUp');

      assert.include(parsedHtml, label);
    })

    it('accepts the customer name', () => {
      const name = 'Hungry Person';

      browser.url('/');
      browser.setValue('#name', name);
      browser.click('#submit-order');
      browser.url('/');

      assert.include(browser.getText('#deliver-to'), name);
    });

    it('accepts the cake type', () => {
      const cakeType = 'Whole Wheat';

      browser.url('/');
      browser.click('#whole-wheat');
      browser.click('#submit-order');
      browser.url('/');

      assert.include(browser.getText('#cake-type'), cakeType);
    });

    it('accepts multiple fillings', () => {
      const firstChoice = 'Strawberries';
      const secondChoice = 'Banana';

      browser.url('/');
      browser.click('#strawberries');
      browser.click('#banana');
      browser.click('#submit-order');
      browser.url('/');

      assert.include(browser.getText('#fillings'), firstChoice);
      assert.include(browser.getText('#fillings'), secondChoice);
    });

    it('accepts the stack size', () => {
      const optionText = 'Double Stack';
      const optionNum = '2';

      browser.url('/');
      browser.selectByVisibleText('#select-stack', optionText)
      browser.click('#submit-order');
      browser.url('/');

      assert.include(browser.getText('#size'), optionNum);
    });
  });

  describe('to clear an order', () => {
    it('deletes the selected options', () => {
      const name = 'Indecisive Person';
      const time = '10:00';

      browser.url('/');
      browser.setValue('#name', name);
      browser.selectByVisibleText('#select-pickUp', time)
      browser.click('#submit-order');
      browser.click('#clear-order');
      browser.url('/');

      assert.equal(browser.getText('#deliver-to span'), '');
      assert.equal(browser.getText('#cake-type span'), '');
      assert.equal(browser.getText('#fillings span'), '');
      assert.equal(browser.getText('#size span'), '');
    });
  });
});