title: How to integrate Adobe RoboHelp documentation to react project
body: <p>I am trying to navigate to robohelp document from react application.</p>
  <p>I have added RoboHelp_CSH.js file under scripts folder,</p>
  <pre><code>// Macromedia
  // Copyright� 1998-2004 eHelp� Corporation.All rights reserved.
  // RoboHelp_CSH.js
  // The Helper function for WebHelp Context Sensitive Help
  
  //     Syntax:
  //     function RH_ShowHelp(hParent, a_pszHelpFile, uCommand, dwData)
  //
  //     hParent
  //          Reserved - Use 0
  //   
  //     pszHelpFile
  //          WebHelp: 
  //               Path to help system start page (&quot;http://www.myurl.com/help/help.htm&quot; or &quot;/help/help.htm&quot;)
  //               For custom windows (defined in Help project), add &quot;&gt;&quot; followed by the window name (&quot;/help/help.htm&gt;mywin&quot;)
  //
  //          WebHelp Enterprise: 
  //               Path to RoboEngine server (&quot;http://RoboEngine/roboapi.asp&quot;)
  //               If automatic merging is turned off in RoboEngine Configuration Manager, specify the project name in the URL (&quot;http://RoboEngine/roboapi.asp?project=myproject&quot;)
  //               For custom windows (defined in Help project), add &quot;&gt;&quot; followed by the window name (&quot;http://RoboEngine/roboapi.asp&gt;mywindow&quot;)
  //
  //     uCommand
  //          Command to display help. One of the following:
  //                    HH_HELP_CONTEXT     // Displays the topic associated with the Map ID sent in dwData
  //                                          if 0, then default topic is displayed.              
  //               The following display the default topic and the Search, Index, or TOC pane. 
  //               Note: The pane displayed in WebHelp Enterprise will always be the window's default pane.
  //                    HH_DISPLAY_SEARCH 
  //                    HH_DISPLAY_INDEX
  //                    HH_DISPLAY_TOC
  //
  //     dwData
  //          Map ID associated with the topic to open (if using HH_HELP_CONTEXT), otherwise 0
  //
  //     Examples:
  //     &lt;p&gt;Click for &lt;A HREF='javascript:RH_ShowHelp(0, &quot;help/help.htm&quot;, 0, 10)'&gt;Help&lt;/A&gt; (map number 10)&lt;/p&gt;
  //     &lt;p&gt;Click for &lt;A HREF='javascript:RH_ShowHelp(0, &quot;help/help.htm&gt;mywindow&quot;, 0, 100)'&gt;Help in custom window (map number 100)&lt;/A&gt;&lt;/p&gt;
  
  
  var gbNav6 = false;
  var gbNav61 = false;
  var gbNav4 = false;
  var gbIE4 = false;
  var gbIE = false;
  var gbIE5 = false;
  var gbIE55 = false;
  var rbNewTab = true;
  var win = null;
  
  var gAgent = navigator.userAgent.toLowerCase();
  var gbMac = (gAgent.indexOf(&quot;mac&quot;) != -1);
  var gbSunOS = (gAgent.indexOf(&quot;sunos&quot;) != -1);
  var gbOpera = (gAgent.indexOf(&quot;opera&quot;) != -1);
  
  var HH_DISPLAY_TOPIC = 0;
  var HH_DISPLAY_TOC = 1;
  var HH_DISPLAY_INDEX = 2;
  var HH_DISPLAY_SEARCH = 3;
  var HH_HELP_CONTEXT = 15;
  
  var gVersion = navigator.appVersion.toLowerCase();
  
  var gnVerMajor = parseInt(gVersion);
  var gnVerMinor = parseFloat(gVersion);
  
  gbIE = (navigator.appName.indexOf(&quot;Microsoft&quot;) != -1);
  if (gnVerMajor &gt;= 4) {
      if (navigator.appName == &quot;Netscape&quot;) {
          gbNav4 = true;
          if (gnVerMajor &gt;= 5)
              gbNav6 = true;
      }
      gbIE4 = (navigator.appName.indexOf(&quot;Microsoft&quot;) != -1);
  }
  if (gbNav6) {
      document.gnPageWidth = innerWidth;
      document.gnPageHeight = innerHeight;
      var nPos = gAgent.indexOf(&quot;netscape&quot;);
      if (nPos != -1) {
          var nVersion = parseFloat(gAgent.substring(nPos + 10));
          if (nVersion &gt;= 6.1)
              gbNav61 = true;
      }
  } else if (gbIE4) {
      var nPos = gAgent.indexOf(&quot;msie&quot;);
      if (nPos != -1) {
          var nVersion = parseFloat(gAgent.substring(nPos + 5));
          if (nVersion &gt;= 5)
              gbIE5 = true;
          if (nVersion &gt;= 5.5)
              gbIE55 = true;
      }
  }
  
  function RH_ShowHelp(hParent, a_pszHelpFile, uCommand, dwData) {
  
      //a_pszHelpFile = helpURL;
      // this function only support WebHelp
      var strHelpPath = helpURL + a_pszHelpFile;
      var strWnd = &quot;&quot;;
      var nPos = a_pszHelpFile.indexOf(&quot;&gt;&quot;);
      if (nPos != -1) {
          strHelpPath = helpURL + a_pszHelpFile.substring(0, nPos);
          strWnd = a_pszHelpFile.substring(nPos + 1);
      }
      if (isServerBased(strHelpPath))
          RH_ShowWebHelp_Server(hParent, strHelpPath, strWnd, uCommand, dwData);
      else
          RH_ShowWebHelp(hParent, strHelpPath, strWnd, uCommand, dwData);
  }
  
  function RH_ShowWebHelp_Server(hParent, strHelpPath, strWnd, uCommand, dwData) {
      // hParent never used.
      ShowWebHelp_Server(strHelpPath, strWnd, uCommand, dwData);
  }
  
  function RH_ShowWebHelp(hParent, strHelpPath, strWnd, uCommand, dwData) {
      // hParent never used.
      ShowWebHelp(strHelpPath, strWnd, uCommand, dwData);
  }
  
  
  function ShowWebHelp_Server(strHelpPath, strWnd, uCommand, nMapId) {
      var a_pszHelpFile = &quot;&quot;;
      if (uCommand == HH_HELP_CONTEXT) {
          if (strHelpPath.indexOf(&quot;?&quot;) == -1)
              a_pszHelpFile = strHelpPath + &quot;?ctxid=&quot; + nMapId;
          else
              a_pszHelpFile = strHelpPath + &quot;&amp;ctxid=&quot; + nMapId;
      }
      else {
          if (strHelpPath.indexOf(&quot;?&quot;) == -1)
              a_pszHelpFile = strHelpPath + &quot;?ctxid=0&quot;;
          else
              a_pszHelpFile = strHelpPath + &quot;&amp;ctxid=0&quot;;
      }
  
      if (strWnd)
          a_pszHelpFile += &quot;&gt;&quot; + strWnd;
  
      // To Open window in new tab
      if (rbNewTab)
          a_pszHelpFile += &quot;&gt;&gt;newwnd=0&quot;;
  
      if (gbIE5 || gbNav6) {
          a_pszHelpFile += &quot;&amp;cmd=newwnd&amp;rtype=iefrm&quot;;
          loadData(a_pszHelpFile);
      }
      else if (gbNav4) {
          a_pszHelpFile += &quot;&amp;cmd=newwnd&amp;rtype=nswnd&quot;;
          var sParam = &quot;left=&quot; + screen.width + &quot;,top=&quot; + screen.height + &quot;,width=auto,height=auto,resizable=yes,scrollbars=yes&quot;;
          win = window.open(a_pszHelpFile, &quot;__webCshStub&quot;, sParam);
      }
      else {
          var sParam = &quot;left=&quot; + screen.width + &quot;,top=&quot; + screen.height + &quot;,width=auto,height=auto,resizable=yes,scrollbars=yes&quot;;
          if (gbIE5)
              win = window.open(&quot;about:blank&quot;, &quot;__webCshStub&quot;, sParam);
          win = window.open(a_pszHelpFile, &quot;__webCshStub&quot;, sParam);
      }
  }
  
  
  export function ShowWebHelp(strHelpPath, strWnd, uCommand, nMapId) {
      var a_pszHelpFile = &quot;&quot;;
      if (uCommand == HH_DISPLAY_TOPIC) {
          a_pszHelpFile = strHelpPath + &quot;#&lt;id=0&quot;;
      }
      if (uCommand == HH_HELP_CONTEXT) {
          a_pszHelpFile = strHelpPath + &quot;#&lt;id=&quot; + nMapId;
          //a_pszHelpFile = strHelpPath + &quot;?rhmapno=&quot; + nMapId + &quot;#&lt;id=&quot; + nMapId;
      }
      else if (uCommand == HH_DISPLAY_INDEX) {
          a_pszHelpFile = strHelpPath + &quot;#&lt;cmd=idx&quot;;
      }
      else if (uCommand == HH_DISPLAY_SEARCH) {
          a_pszHelpFile = strHelpPath + &quot;#&lt;cmd=fts&quot;;
      }
      else if (uCommand == HH_DISPLAY_TOC) {
          a_pszHelpFile = strHelpPath + &quot;#&lt;cmd=toc&quot;;
      }
      if (strWnd)
          a_pszHelpFile += &quot;&gt;&gt;wnd=&quot; + strWnd;
     
      //To Open window in new tab
      if (rbNewTab)
          a_pszHelpFile += &quot;&gt;&gt;newwnd=0&quot;;
      if (win)
          win.close();
  
      if (a_pszHelpFile) {
          //if (gbIE5 || gbNav6)
          //  loadData(a_pszHelpFile);
          //if (gbNav4)
          //{
          //  var sParam = &quot;left=&quot;+screen.width+&quot;,top=&quot;+screen.height+&quot;,width=100,height=100&quot;;
          //  window.open(a_pszHelpFile, &quot;__webCshStub&quot;, sParam);
          //}
          //else
          {
              // setting the properties for popup window open
              var sParam = &quot;left=&quot; + screen.width + &quot;,top=&quot; + screen.height + &quot;,width=auto,height=auto,resizable=yes,scrollbars=yes&quot;;            
              if (gbIE5)
                  win = window.open(&quot;about:blank&quot;, &quot;__webCshStub&quot;, sParam);
  
              win = window.open(a_pszHelpFile, &quot;__webCshStub&quot;, sParam);
  
              // move popup window to center of the screen.
              // win.moveTo(300, 0);
          }
      }
  
      if (win)
          win.focus();
  }
  
  function isServerBased(a_pszHelpFile) {
      if (a_pszHelpFile.length &gt; 0) {
          var nPos = a_pszHelpFile.lastIndexOf('.');
          if (nPos != -1 &amp;&amp; a_pszHelpFile.length &gt;= nPos + 4) {
              var sExt = a_pszHelpFile.substring(nPos, nPos + 4);
              if (sExt.toLowerCase() == &quot;.htm&quot;) {
                  return false;
              }
          }
      }
      return true;
  }
  
  function getElement(sID) {
      if (document.getElementById)
          return document.getElementById(sID);
      else if (document.all)
          return document.all(sID);
      return null;
  }
  
  function loadData(sFileName) {
      if (!getElement(&quot;dataDiv&quot;)) {
          if (!insertDataDiv()) {
              gsFileName = sFileName;
              return;
          }
      }
      var sHTML = &quot;&quot;;
      if (gbMac)
          sHTML += &quot;&lt;iframe name=\&quot;__WebHelpCshStub\&quot; src=\&quot;&quot; + sFileName + &quot;\&quot;&gt;&lt;/iframe&gt;&quot;;
      else
          sHTML += &quot;&lt;iframe name=\&quot;__WebHelpCshStub\&quot; style=\&quot;visibility:hidden;width:0;height:0\&quot; src=\&quot;&quot; + sFileName + &quot;\&quot;&gt;&lt;/iframe&gt;&quot;;
  
      var oDivCon = getElement(&quot;dataDiv&quot;);
      if (oDivCon) {
          if (gbNav6) {
              if (oDivCon.getElementsByTagName &amp;&amp; oDivCon.getElementsByTagName(&quot;iFrame&quot;).length &gt; 0) {
                  oDivCon.getElementsByTagName(&quot;iFrame&quot;)[0].src = sFileName;
              }
              else
                  oDivCon.innerHTML = sHTML;
          }
          else
              oDivCon.innerHTML = sHTML;
      }
  }
  
  function insertDataDiv() {
      var sHTML = &quot;&quot;;
      if (gbMac)
          sHTML += &quot;&lt;div id=dataDiv style=\&quot;display:none;\&quot;&gt;&lt;/div&gt;&quot;;
      else
          sHTML += &quot;&lt;div id=dataDiv style=\&quot;visibility:hidden\&quot;&gt;&lt;/div&gt;&quot;;
  
      var obj = document.body;
      if (gbIE5) {
          obj.insertAdjacentHTML(&quot;beforeEnd&quot;, sHTML);
      }
      else if (gbNav6) {
          var r = obj.ownerDocument.createRange();
          r.setStartBefore(obj);
          var parsedHTML = r.createContextualFragment(sHTML);
          obj.appendChild(parsedHTML);
      }
      return true;
  }
  </code></pre>
  <p>From react tsx file i am trying to access document</p>
  <p><strong>First try:</strong> (by directly accessing url - i am able to load page from below url in browser)</p>
  <pre><code> &lt;a className=&quot;reportsInfo marginBten&quot; href=&quot;https://url.com/How_to_create_document.htm#%3Cid=33%3E%3Enewwnd=0&quot; target=&quot;_new&quot; title=&quot;Help&quot;&gt;&lt;/a&gt;
  </code></pre>
  <p><strong>Second try:</strong> (from js file by passing id)</p>
  <pre><code>import * as webhelp from &quot;../../../scripts/RoboHelp_CSH&quot;;
  
  const navigateHelp = (strHelpPath: any, strWnd: any, uCommand: any, nMapId: any) =&gt; {
          webhelp.ShowWebHelp(strHelpPath, strWnd, uCommand, nMapId);
   }
  
  &lt;a onClick={() =&gt; navigateHelp(0, &quot;How_to_create_document.htm&quot;,'HH_HELP_CONTEXT', 30)} tabIndex={-1} title=&quot;Help&quot;&gt;&lt;/a&gt;
  </code></pre>
  <p>i get below error when i try to do both, in RoboHelp_CSH.js file</p>
  <p><a href="https://i.stack.imgur.com/oakDI.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/oakDI.jpg" alt="enter image description here" /></a></p>
  <p>i am not sure what is the issue.</p>
  <p>Url is correct as same is used in other javascript project and it works fine.I am able to open the page by hitting url.</p>