title: setTimeout not working on production but it works fine on local enviroment
body: <p>I had a react-app that is being used as a widget in Iframe. And there I had a report page for which we have an option to print that.</p>
  <p>I am using this StackOverflow <a href="https://stackoverflow.com/questions/42014507/how-can-i-set-the-default-filename-for-the-chrome-print-dialog-from-within-an-if">solution</a> to use the print function. Additionally, I have just added a timeout function to let the page load API data first and then open the print function. This piece of code works very fine when tested in the local environment, that is, the print popup appears after 2.7 seconds (desired behavior) but in production, the print popup opens instantly (undesired behavior).</p>
  <pre><code>const onClickOfPrint = () =&gt; {
      var title = questionnaireQuestionsSuccessData.name;
      try {
        // same-origin frame
        document.title = window.parent.document.title = title; // to check if same origin
        // handlePrint();
      } catch (err) {
        // cross-origin frame
        var p = window.open(reportPageUrl);
        p.onload = function () {
          p.document.title = title;
  
          const closePopup = () =&gt; {
            p.close();
          };
  
          if ('onafterprint' in p) {
            // FF and IE
            p.onafterprint = closePopup;
          } else {
            // webkit don't support onafterprint
            var mediaQueryList = p.matchMedia('print');
            mediaQueryList.addEventListener('change', mqlListener);
            const mqlListener = (mql) =&gt; {
              if (!mql.matches) {
                closePopup();
                mediaQueryList.removeEventListener('change', mqlListener);
              }
            };
          }
        };
        setTimeout(() =&gt; {
              p.print();
            }, 2700);
      }
    };
  </code></pre>