title: How to pass paragraph headings to html and back
body: <p>I'm trying to write a function that displays paragraph headings from inside a google document onto an HTML sidebar, and allows you to select them (using checkboxes)</p>
  <p>After you press a button it will call a function from the Google App Script to format all of the headings in a specific way.</p>
  <hr />
  <p>Detailed Process:</p>
  <ol>
  <li>The user presses a refresh button to display all paragraph headings. A Google App Script function (called from HTML file) gets an array of all the headings in the document.</li>
  <li>The array is passed to the HTML file, where a javascript function displays each heading in the array as a checkbox</li>
  <li>The user selects some checkboxes and presses a button. A javascript function gets the # of each checkbox that is selected and for each one, gets the corresponding heading (using array)</li>
  <li>Now, each heading is passed back to the Google App Script, where they are all formatted in a specific way (for example: bolded).</li>
  </ol>
  <hr />
  <p><strong>The issue: passing an array of paragraph headings to an HTML file doesn't work since paragraph headings are a feature of google app scripts, so all of the headings return empty when they are passed back to the Google App Script.</strong></p>
  <p>Is there a way to get around this?</p>
  <hr />
  <p>Things I've Tried:</p>
  <ol>
  <li>Making the array of headings a global variable in GAS (google app
  script) and doing everything inside the app script
  <ul>
  <li>Doesn't work: global variables in GAS are <a href="https://stackoverflow.com/a/17375386/13716845">static</a> so every time the user refreshes the headings or changes something in the doc, this wouldn't work anymore.</li>
  </ul>
  </li>
  <li>Using PropertiesService instead of a global function
  <ul>
  <li>Doesn't work: only takes strings as input so I can't input paragraph headings that need to be formatted inside the document :(</li>
  </ul>
  </li>
  </ol>
  <hr />
  <h1>Minimal Reproducible Example:</h1>
  <p>Javascript (in HTML file):</p>
  <pre><code>google.script.run.withSuccessHandler(paragraphHeadingTest).getParagraphHeadings();
  function paragraphHeadingTest(paragraphHeadings) {
    google.script.run.logOutput(paragraphHeadings);
  }
  </code></pre>
  <p>Google App Script Code:</p>
  <pre><code>function getParagraphHeadings() {
    var document = DocumentApp.getActiveDocument().getBody();
    var paragraphs = document.getParagraphs();
    return paragraphs;
  }
  
  function logOutput(output) {
    Logger.log(output);
  }
  </code></pre>