Start component testing
This commit is contained in:
parent
c9e5b11416
commit
33c16bd072
5
packages/components/jest.config.js
Normal file
5
packages/components/jest.config.js
Normal file
|
@ -0,0 +1,5 @@
|
|||
/** @type {import('ts-jest').JestConfigWithTsJest} */
|
||||
module.exports = {
|
||||
preset: 'ts-jest',
|
||||
testEnvironment: 'jsdom',
|
||||
};
|
|
@ -43,7 +43,11 @@
|
|||
"@types/react": "^18.0.18",
|
||||
"@types/styled-components": "^5.1.26",
|
||||
"@types/webpack": "^5.28.0",
|
||||
"canvas": "^2.10.1",
|
||||
"cross-env": "^7.0.3",
|
||||
"jest": "^29.0.3",
|
||||
"jest-environment-jsdom": "^29.0.3",
|
||||
"jsdom": "^20.0.0",
|
||||
"mini-css-extract-plugin": "^2.6.1",
|
||||
"postcss-cli": "^10.0.0",
|
||||
"postcss-import": "^15.0.0",
|
||||
|
@ -53,6 +57,7 @@
|
|||
"react-scripts": "^5.0.1",
|
||||
"style-loader": "^3.3.1",
|
||||
"tailwindcss": "^3.1.8",
|
||||
"ts-jest": "^29.0.2",
|
||||
"ts-loader": "^9.4.0",
|
||||
"tsconfig-paths-webpack-plugin": "^4.0.0",
|
||||
"typescript": "^4.8.3",
|
||||
|
@ -75,7 +80,8 @@
|
|||
"all": "yarn bundle && yarn build",
|
||||
"lint": "prettier --check .",
|
||||
"format": "prettier --write .",
|
||||
"prepack": "yarn run build:cjs && yarn run bundle"
|
||||
"prepack": "yarn run build:cjs && yarn run bundle",
|
||||
"test": "jest"
|
||||
},
|
||||
"eslintConfig": {
|
||||
"extends": [
|
||||
|
|
|
@ -85,7 +85,7 @@ export const DistributionChart: React.FC<DistributionChartProps> = (props) => {
|
|||
|
||||
const spec = buildVegaSpec(props);
|
||||
|
||||
let widthProp = width ? width : size.width;
|
||||
let widthProp = width ? width : (isFinite(size.width) ? size.width : 400);
|
||||
if (widthProp < 20) {
|
||||
console.warn(
|
||||
`Width of Distribution is set to ${widthProp}, which is too small`
|
||||
|
@ -96,6 +96,10 @@ export const DistributionChart: React.FC<DistributionChartProps> = (props) => {
|
|||
shape.discrete.concat(shape.continuous)
|
||||
);
|
||||
|
||||
const vegaData = {data: shapes.value, domain, samples}
|
||||
|
||||
console.log(vegaData)
|
||||
|
||||
return (
|
||||
<div style={{ width: widthProp }}>
|
||||
{logX && shapes.value.some(hasMassBelowZero) ? (
|
||||
|
@ -105,7 +109,7 @@ export const DistributionChart: React.FC<DistributionChartProps> = (props) => {
|
|||
) : (
|
||||
<Vega
|
||||
spec={spec}
|
||||
data={{ data: shapes.value, domain, samples }}
|
||||
data={vegaData}
|
||||
width={widthProp - 10}
|
||||
height={height}
|
||||
actions={actions}
|
||||
|
|
|
@ -298,7 +298,7 @@ export const ExpressionViewer: React.FC<Props> = ({ value, width }) => {
|
|||
{() => (
|
||||
<div>
|
||||
<span>No display for type: </span>{" "}
|
||||
<span className="font-semibold text-slate-600">{value.tag}</span>
|
||||
<span className="font-semibold text-slate-600">{(value as {tag: string}).tag}</span>
|
||||
</div>
|
||||
)}
|
||||
</VariableList>
|
||||
|
|
13
packages/components/test/basic.test.tsx
Normal file
13
packages/components/test/basic.test.tsx
Normal file
|
@ -0,0 +1,13 @@
|
|||
import {render} from '@testing-library/react'
|
||||
import React from 'react'
|
||||
import '@testing-library/jest-dom'
|
||||
import { SquiggleChart } from '../src/index'
|
||||
|
||||
test('Logs no warnings or errors', async () => {
|
||||
|
||||
const { unmount } = render(<SquiggleChart code={"normal(0, 1)"} />)
|
||||
unmount()
|
||||
|
||||
expect(console.warn).not.toBeCalled()
|
||||
expect(console.error).not.toBeCalled()
|
||||
})
|
8
packages/components/test/setup.js
Normal file
8
packages/components/test/setup.js
Normal file
|
@ -0,0 +1,8 @@
|
|||
global.console = {
|
||||
...console,
|
||||
log: jest.fn(console.log),
|
||||
debug: jest.fn(console.debug),
|
||||
info: jest.fn(console.info),
|
||||
warn: jest.fn(console.warn),
|
||||
error: jest.fn(console.error),
|
||||
};
|
Loading…
Reference in New Issue
Block a user