template literals support within JSX

[saunders99999]

Are template literals inside of JSX supported?

Most of the time, template literals are transpiled to ES5 as expected. When there are multiple template literal-JSX snippets in a method, it does not always transpile the template literals.

I've added this sample https://github.com/saunders99999/babel-inc-dom-sample/blob/master/README.md

https://github.com/saunders99999/babel-inc-dom-sample/blob/master/.babelrc babel configuration with transform-incremental-dom and @babel/plugin-transform-template-literals

code samples https://github.com/saunders99999/babel-inc-dom-sample/blob/master/src/index.jsx

export function renderDoesNotWork(el) {
  const elemBody = <span class="fred" />;
  return (
      // transpile bad --> (0, _incrementalDom.elementOpen)("div", null, null, "id", `${el.id}-track`);
      <div id={ `${ el.id }-track` }>
          { elemBody }
      </div>
  );
}

export function renderWorks(el) {
  const elemBody = <span class="fred" />;

  // transpile good --> var elid = "".concat(el.id, "-track");
  const elid = `${ el.id }-track`;
  return (
      <div id={ elid }>
          { elemBody }
      </div>
  );
}

export function optionalReturnDoesNotWork(colIndex,idprefix) {
  if (colIndex === 0) {
      return (
          // transpile good -> return (0, _incrementalDom.elementVoid)("th", null, null, "id", "".concat(idprefix, "-fred1"));
          <th id={ `${ idprefix }-fred1`} />
      );
  }
  return (
      // transpile bad --> return (0, _incrementalDom.elementVoid)("th", null, null, "id", `${idprefix}-fred2`);
      <th id={ `${ idprefix }-fred2`} />
  );
}