TypeError in production build with React

[kohleman]

Bug Description
I have built a React app using https://create-react-app.dev/ and xmlbuilder2. Everything works fine when I start the app with yarn start in development mode. But when I build the app using yarn build I get this error when triggering an XML conversion:

classCallCheck.js:3 Uncaught (in promise) TypeError: Cannot call a class as a function
    at e.exports (classCallCheck.js:3)
    at new n (NodeImpl.ts:93)
    at n.<anonymous> (createSuper.js:14)
    at new n (DocumentImpl.ts:69)
    at Object.t.create_document (CreateAlgorithm.ts:61)
    at new n (WindowImpl.ts:28)
    at Function.value (WindowImpl.ts:41)
    at Object.t.create_window (CreateAlgorithm.ts:47)
    at e.get (DOMImpl.ts:68)
    at new e (DOMImplementationImpl.ts:27)

To Reproduce
Steps to reproduce the behavior just paste this code into your App.js after creating your app via npx create-react-app my-app

import React from 'react';
import logo from './logo.svg';
import './App.css';
import { create } from 'xmlbuilder2';

const testJson = 
{
  "widget": {
    "debug": "on",
      "window": {
      "title": "Sample Konfabulator Widget",
        "name": "main_window",
          "width": 500,
            "height": 500
    },
    "image": {
      "src": "Images/Sun.png",
        "name": "sun1",
          "hOffset": 250,
            "vOffset": 250,
              "alignment": "center"
    },
    "text": {
      "data": "Click Here",
        "size": 36,
          "style": "bold",
            "name": "text1",
              "hOffset": 250,
                "vOffset": 100,
                  "alignment": "center",
                    "onMouseUp": "sun1.opacity = (sun1.opacity / 100) * 90;"
    }
  }
}    

const xmlDoc = create(testJson);
const compl = xmlDoc.end({prettyPrint: true});
console.log(compl);

function App() {
  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Edit <code>src/App.js</code> and save to reload.
        </p>
        <a
          className="App-link"
          href="https://reactjs.org"
          target="_blank"
          rel="noopener noreferrer"
        >
          Learn React
        </a>
      </header>
    </div>
  );
}

export default App;

Expected behavior
This should work in development mode as well as in production mode.

Version:
node --version
v12.18.0

npm --version
6.14.5

[email protected]

Additional context
Not sure if it is a xmlbuilder2 bug.

[kohleman]

If I use xmlbuilder this error is not thrown.

[oozcitak]

I was able to reproduce the error. I'm looking into it. I am not familier with react that much, so this may take some time.

[oozcitak]

Thank you for reporting this. It was quite hard to hunt this one, but it was quite an important bug. This should now be fixed with version 2.1.4.

[kohleman]

You are welcome. But of course also thank you for fixing it so quickly. Switched back to xmlbuilder2 and it works.