Setting up single-player tests before adding spinner

JavaScript
11

Which version of the code should we do the tests on?

All 3 of these work as they are intended to, and both work the same way.

In the jsfiddle links it can be seen that clicking on the play button right away, the player does not open. So that tells you it is working as it is intended to.

Here is me clicking on the play button right away and nothing happening.

To reproduce, click run, then the play button really fast.

So, the next thing would be adding the spinner?

Put the spinner in, then proceed to do tests to make sure it is working as it should?

Does it make sense to do tests on a code that is already working, where there are no issues?

Would it be better to add the spinner in, then do tests on that to make sure it is working how it should?

Code 1 https://jsfiddle.net/z1kywacL/

In referring to a different code I remember you saying this:

One way is to add a body variable to the init function. That does though result in us having a body variable in two places, one in resetPage, and one in init. That doesn’t become a problem until we have three such duplicates in the one module. If that occurs we can then move one of them up to a higher level, such as to the top of the module, and use that single body variable from all other places instead.

There are not 3 or more duplicates here so maybe using this code may not be beneficial.

function getIframe() {
    return document.querySelector("iframe");
  }

  function onPlayerReady(event) {
    const iframe = getIframe();
    iframe.dispatchEvent(events.afterPlayerReady);
  }

    const iframe = getIframe();
    const eventHandler = eventHandlers.afterPlayerReady;
    iframe.addEventListener("afterPlayerReady", eventHandler);
  }

Code 2 https://jsfiddle.net/f7yjx8nL/

I believe player.h;

Is the same as: doing: document.querySelector("iframe");

So, this would be a different way of writing it.

function onPlayerReady(event) {
    const iframe = document.querySelector("iframe");
    iframe.dispatchEvent(events.afterPlayerReady);
  }

    const iframe = document.querySelector("iframe");
    const eventHandler = eventHandlers.afterPlayerReady;
    iframe.addEventListener("afterPlayerReady", eventHandler);
  }

Code 3 https://jsfiddle.net/f7yjx8nL/2/

The instructions I followed used player.h

function onPlayerReady(event) {
    const iframe = player.h;
    iframe.dispatchEvent(events.afterPlayerReady);
  }

    const iframe = player.h;
    const eventHandler = eventHandlers.afterPlayerReady;
    iframe.addEventListener("afterPlayerReady", eventHandler);
  }

These were the instructions I followed to build the code: post #175

The only thing missing from the code is the spinner, which was not added to those particular instructions.

1 Like