0

I have an onclick handler that looks like this:

      <ButtonPrimary
        alignSelf="center"
        component="a"
        marginBottom={4}
        marginTop={4}
        onClick={() => {
          triggerCall()
          closeModal()
          clearFilters()
        }}
        size={SIZE.LARGE}
      >
        See results
      </ButtonPrimary>

the triggerCall() method in the onClick() handler looks like this:

  const triggerCall = () => {
    if (getDefault) {
      getDefault === 'a'
        ? window.show('typeA')
        : window.show('typeB')
    } else {
      isDefaultEnabled
        ? window.show('typeA')
        : window.show('typeB')
    }
  }

The above method checks state and makes an api call to fetch a type of view. I am running into a weird situation where in my local environment things work fine. I can drop breakpoints on the method in the onClick() handler and the request is made as expected. However, when I deploy my changes to my live dev env, the method is never called. Looking in the console I can't place a breakpoint and the app. never goes into the method. Is it a react issue or did I structure my code incorrectly? Is this indicative or a larger issue I am not aware of and should address in my app?

Haq.H
  • 863
  • 7
  • 20
  • 47
  • My first thought: make sure you clear your browsers cache. Try viewing the page in incognito mode? – Cyclonecode Jul 22 '22 at 15:05
  • No luck, the issue persists – Haq.H Jul 22 '22 at 15:10
  • Make sure you actually deployed the code to the correct environment. – Cyclonecode Jul 22 '22 at 15:14
  • I am confident it's deployed correctly. I can see it in the console as well. – Haq.H Jul 22 '22 at 15:16
  • Could be several issues. Where are ```getDefault``` and ```isDefaultEnabled``` coming from? If they're false, the functions will not be called. Also, ```window.show``` is not native browser functionality, so that would have to be defined on the ```window``` object beforehand to be called. What is that function doing, and where is it defined? You're also calling 3 separate functions in this handler. React state updates are asynchronous. If these have side effects that change state, they could be conflicting with one another. – Chris B. Jul 22 '22 at 15:43

0 Answers0