JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdn.plot.ly/plotly-cartesian-1.51.3.js"></script>
<div id="plot"></div>
<p>The bins are not shared by the two traces, and the horizontal position of the second trace's bars does not make sense.</p>
<p>The appearance of the bug seems dependent on the actual data. Some other data arrays result in a correct display.</p>
<p>The bug is caused by the use of the cartesian dist release in 1.51.3. Using the full dist release of the same version works.</p>
JavaScript
var x1 = [1,3];
var x2 = [1,20];
var trace1 = {
x: x1,
type: "histogram",
};
var trace2 = {
x: x2,
type: "histogram",
};
var data = [trace1, trace2];
var layout = {barmode: "stack", height: 200, width: 400, margin: {t:30, b:30}};
Plotly.plot("plot", data, layout);