forked from mui/material-ui
-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
a82772f
commit 9a3c143
Showing
6 changed files
with
131 additions
and
53 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,27 +1,21 @@ | ||
import React from 'react'; | ||
import { makeStyles, Theme, createStyles } from '@material-ui/core/styles'; | ||
import Alert from '@material-ui/lab/Alert'; | ||
|
||
const useStyles = makeStyles((theme: Theme) => | ||
createStyles({ | ||
root: { | ||
width: '100%', | ||
'& > * + *': { | ||
marginTop: theme.spacing(2), | ||
}, | ||
}, | ||
}), | ||
); | ||
|
||
export default function SimpleAlerts() { | ||
const classes = useStyles(); | ||
import * as React from 'react'; | ||
import { XGrid } from "@material-ui/x-grid"; | ||
|
||
export default function App(props) { | ||
return ( | ||
<div className={classes.root}> | ||
<Alert severity="error">This is an error alert — check it out!</Alert> | ||
<Alert severity="warning">This is a warning alert — check it out!</Alert> | ||
<Alert severity="info">This is an info alert — check it out!</Alert> | ||
<Alert severity="success">This is a success alert — check it out!</Alert> | ||
<div style={{ width: props.large ? 400 : 300, height: 600 }}> | ||
<XGrid | ||
rows={[ | ||
{ | ||
brand: "Nike", | ||
}, | ||
]} | ||
columns={[ | ||
{ field: "id", hide: true }, | ||
{ field: "brand", width: 100 }, | ||
]} | ||
options={{ checkboxSelection: true }} | ||
/> | ||
</div> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,21 +1,56 @@ | ||
import * as React from 'react'; | ||
import { getClasses, createMount, describeConformance } from 'test/utils'; | ||
import Paper from '@material-ui/core/Paper'; | ||
import Alert from './Alert'; | ||
import { createClientRender, act } from 'test/utils'; | ||
import { XGrid } from "@material-ui/x-grid"; | ||
import { expect } from 'chai'; | ||
|
||
describe('<Alert />', () => { | ||
const mount = createMount(); | ||
let classes; | ||
|
||
before(() => { | ||
classes = getClasses(<Alert />); | ||
async function sleep(duration) { | ||
return new Promise((resolve) => { | ||
setTimeout(() => { | ||
resolve(); | ||
}, duration) | ||
}); | ||
} | ||
|
||
describe.only('<XGrid />', () => { | ||
const render = createClientRender(); | ||
|
||
it('should resize the width of the columns', async () => { | ||
if (/jsdom/.test(window.navigator.userAgent)) { | ||
// TODO: Unclear why this fails. Not important | ||
// since a browser test gives us more confidence anyway | ||
this.skip(); | ||
} | ||
|
||
describeConformance(<Alert />, () => ({ | ||
classes, | ||
inheritComponent: Paper, | ||
mount, | ||
refInstanceof: window.HTMLDivElement, | ||
skip: ['componentProp'], | ||
})); | ||
function App(props) { | ||
const { width = 300 } = props | ||
return ( | ||
<div style={{ width, height: 300 }}> | ||
<XGrid | ||
rows={[ | ||
{ | ||
brand: "Nike", | ||
}, | ||
]} | ||
columns={[ | ||
{ field: "id", hide: true }, | ||
{ field: "brand", width: 100 }, | ||
]} | ||
options={{ checkboxSelection: true }} | ||
/> | ||
</div> | ||
); | ||
} | ||
|
||
const { container, setProps } = render(<App />); | ||
let rect; | ||
rect = container.querySelector('[role="row"][data-rowindex="0"]').getBoundingClientRect(); | ||
expect(rect.width).to.equal(300 - 2); | ||
setProps({ width: 400 }); | ||
act(() => { | ||
window.dispatchEvent(new window.Event('resize', {})); | ||
}); | ||
await sleep(200); | ||
rect = container.querySelector('[role="row"][data-rowindex="0"]').getBoundingClientRect(); | ||
expect(rect.width).to.equal(400 - 2); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters