mirror of
https://github.com/chartjs/Chart.js.git
synced 2024-10-06 04:09:08 +02:00
Add integration test(s) for Web (#10563)
Adds a basic react integration test
This commit is contained in:
parent
3123a133fe
commit
1551537a40
@ -1 +1,2 @@
|
||||
dist/*
|
||||
test/integration/react-browser/*
|
||||
|
@ -7,6 +7,11 @@ const childProcess = require('child_process');
|
||||
|
||||
const {describe, it} = require('mocha');
|
||||
|
||||
const platforms = [
|
||||
'node',
|
||||
'react-browser'
|
||||
];
|
||||
|
||||
function exec(command, options = {}) {
|
||||
const output = childProcess.execSync(command, {
|
||||
encoding: 'utf-8',
|
||||
@ -27,7 +32,7 @@ describe('Integration Tests', () => {
|
||||
path.join(tmpDir, 'package.tgz'),
|
||||
);
|
||||
|
||||
function testOnNodeProject(projectName) {
|
||||
function testProjectOnPlatform(projectName) {
|
||||
const projectPath = path.join(__dirname, projectName);
|
||||
|
||||
const packageJSONPath = path.join(projectPath, 'package.json');
|
||||
@ -42,5 +47,7 @@ describe('Integration Tests', () => {
|
||||
}).timeout(5 * 60 * 1000);
|
||||
}
|
||||
|
||||
testOnNodeProject('node');
|
||||
for (const platform of platforms) {
|
||||
testProjectOnPlatform(platform)
|
||||
}
|
||||
});
|
||||
|
26
test/integration/react-browser/package.json
Normal file
26
test/integration/react-browser/package.json
Normal file
@ -0,0 +1,26 @@
|
||||
{
|
||||
"private": true,
|
||||
"description": "chart.js should work in react-browser (Web)",
|
||||
"dependencies": {
|
||||
"chart.js": "file:../package.tgz",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-scripts": "5.0.1",
|
||||
"web-vitals": "^2.1.4"
|
||||
},
|
||||
"scripts": {
|
||||
"test": "react-scripts build"
|
||||
},
|
||||
"browserslist": {
|
||||
"production": [
|
||||
">0.2%",
|
||||
"not dead",
|
||||
"not op_mini all"
|
||||
],
|
||||
"development": [
|
||||
"last 1 chrome version",
|
||||
"last 1 firefox version",
|
||||
"last 1 safari version"
|
||||
]
|
||||
}
|
||||
}
|
36
test/integration/react-browser/public/index.html
Normal file
36
test/integration/react-browser/public/index.html
Normal file
@ -0,0 +1,36 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="theme-color" content="#000000" />
|
||||
<meta
|
||||
name="description"
|
||||
content="Web site created using create-react-app"
|
||||
/>
|
||||
<!--
|
||||
Notice the use of %PUBLIC_URL% in the tags above.
|
||||
It will be replaced with the URL of the `public` folder during the build.
|
||||
Only files inside the `public` folder can be referenced from the HTML.
|
||||
|
||||
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
|
||||
work correctly both with client-side routing and a non-root public URL.
|
||||
Learn how to configure a non-root public URL by running `npm run build`.
|
||||
-->
|
||||
<title>Chartjs test React App</title>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||
<div id="root"></div>
|
||||
<!--
|
||||
This HTML file is a template.
|
||||
If you open it directly in the browser, you will see an empty page.
|
||||
|
||||
You can add webfonts, meta tags, or analytics to this file.
|
||||
The build step will place the bundled scripts into the <body> tag.
|
||||
|
||||
To begin the development, run `npm start` or `yarn start`.
|
||||
To create a production bundle, use `npm run build` or `yarn build`.
|
||||
-->
|
||||
</body>
|
||||
</html>
|
30
test/integration/react-browser/src/App.js
vendored
Normal file
30
test/integration/react-browser/src/App.js
vendored
Normal file
@ -0,0 +1,30 @@
|
||||
import { useEffect } from 'react';
|
||||
import {Chart, DoughnutController, ArcElement} from 'chart.js';
|
||||
import {merge} from 'chart.js/helpers';
|
||||
|
||||
Chart.register(DoughnutController, ArcElement);
|
||||
|
||||
function App() {
|
||||
useEffect(() => {
|
||||
const c = Chart.getChart('myChart');
|
||||
if(c) c.destroy();
|
||||
|
||||
new Chart('myChart', {
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
labels: ['Chart', 'JS'],
|
||||
datasets: [{
|
||||
data: [2, 3]
|
||||
}]
|
||||
}
|
||||
})
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<div className="App">
|
||||
<canvas id="myChart"></canvas>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default App;
|
10
test/integration/react-browser/src/index.js
vendored
Normal file
10
test/integration/react-browser/src/index.js
vendored
Normal file
@ -0,0 +1,10 @@
|
||||
import React from 'react';
|
||||
import ReactDOM from 'react-dom/client';
|
||||
import App from './App';
|
||||
|
||||
const root = ReactDOM.createRoot(document.getElementById('root'));
|
||||
root.render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>
|
||||
);
|
Loading…
Reference in New Issue
Block a user