Wrapper is undefined

Code I’m working on.

I think I must be forgetting to do something to resolve that issue.

It’s set up relatively the same as this code.

Which was worked on here:
https://www.sitepoint.com/community/t/getting-the-audio-to-start-after-the-image-is-clicked/314915/9

Am I supposed to remove const from here?

  function initButton(selector) {
    const wrapper = document.querySelector(selector);

Then it would be written like this?
https://jsfiddle.net/05wdxq3y/1/

  function initButton(selector) {
    wrapper = document.querySelector(selector);
    wrapper.addEventListener("click", playButtonClickHandler);
  }
  initButton(".wrape");
  return {
    button:wrapper.querySelector(".playButton")
  };
}());

Just need to remove the const so you’re setting the wrapper variable declare above.
Otherwise you’re creating a new variable in this function and leaving the previously declared one undefined - which is what the error is saying.

+ wrapper = document.querySelector(selector);
- const wrapper = document.querySelector(selector);
1 Like

Actually, there’s no need to declare wrapper outside of the initButton() function in the first place since it is getting assigned a value only once anyway; instead, you might just return the button so you can keep the const declaration:

const player = (function makePlayer () {
  // ...

  function initButton (selector) {
    const wrapper = document.querySelector(selector)
    wrapper.addEventListener('click', playButtonClickHandler)
    return wrapper.querySelector('.playButton')
  }
  
  return {
    button: initButton('.wrape')
  }
}())
1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.