I create a site with a Bootstrap carousel. In this carousel I try to show two iframes with a site whitch contains a chart from chartjs.org.
On Firefox 91.1.0esr (32-Bit) I get this error:
Uncaught
Exception { name: "NS_ERROR_FAILURE", message: "", result: 2147500037, filename: "https://cdn.jsdelivr.net/npm/chart.js@3.7.1/dist/chart.min.js", lineNumber: 13, columnNumber: 0, data: null, stack: "fit@https://cdn.jsdelivr.net/npm/chart.js@3.7.1/dist/chart.min.js:13:146316
The error does not appear in Chrome and Edge. Is it a Bug in Firefox?
The site with the carousel:
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
<div class="carousel slide carousel-fade" data-bs-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active" data-bs-interval="5000">
<iframe src="./site.html" title="Iframe1"></iframe>
</div>
<div class="carousel-item" data-bs-interval="5000">
<iframe src="./site.html" title="Iframe2"></iframe>
</div>
</div>
</div>
The site with the chart:
const labels = [
'January',
'February',
'March',
'April',
'May',
'June',
];
const data = {
labels: labels,
datasets: [{
label: 'My First dataset',
backgroundColor: 'rgb(255, 99, 132)',
borderColor: 'rgb(255, 99, 132)',
data: [0, 10, 5, 2, 20, 30, 45],
}]
};
const config = {
type: 'line',
data: data,
options: {}
};
const myChart = new Chart(
document.getElementById('diagramm'),
config
);
<script src="https://cdn.jsdelivr.net/npm/chart.js@3.7.1/dist/chart.min.js"></script>
<canvas id="diagramm"></canvas>