add enzyme snapshot serializer to jest
converts all the existing `expect(component.debug()).toMatchSnapshot()` to: `expect(component).toMatchSnapshot()` which creates more detailed and more diff-able snapshots test plan: - specs pass -- this only affects js test code Change-Id: Ib6dbcc1e3f87e61a251e4635dc68353aca57aeac Reviewed-on: https://gerrit.instructure.com/167651 Tested-by: Jenkins Reviewed-by: Ryan Shaw <ryan@instructure.com> QA-Review: Ryan Shaw <ryan@instructure.com> Product-Review: Ryan Shaw <ryan@instructure.com>
This commit is contained in:
Jon Willesen
Jon Willesen
parent
a6f2e6f996
commit
3fddcf98e2
|
|
@ -49,7 +49,7 @@ const props = {
|
|||
describe('ActAsModal', () => {
|
||||
it('renders with panda svgs, user avatar, table, and proceed button present', () => {
|
||||
const wrapper = shallow(<ActAsModal {...props} />)
|
||||
// expect(wrapper).toMatchSnapshot() // Coming soon.... (need to get enzyme upgraded to 3.x first)
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
|
||||
const mask = wrapper.find(ActAsMask)
|
||||
const panda = wrapper.find(ActAsPanda)
|
||||
|
|
|
|||
|
|
@ -0,0 +1,499 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`ActAsModal renders with panda svgs, user avatar, table, and proceed button present 1`] = `
|
||||
<div>
|
||||
<CanvasInstUIModal
|
||||
label="Act as User"
|
||||
onDismiss={[Function]}
|
||||
open={true}
|
||||
size="fullscreen"
|
||||
transition="fade"
|
||||
>
|
||||
<ModalBody
|
||||
as="div"
|
||||
padding="medium"
|
||||
>
|
||||
<div
|
||||
className="ActAs__body"
|
||||
>
|
||||
<div
|
||||
className="ActAs__svgContainer"
|
||||
>
|
||||
<div
|
||||
className="ActAs__svg"
|
||||
>
|
||||
<ActAsPanda />
|
||||
</div>
|
||||
<div
|
||||
className="ActAs__svg"
|
||||
>
|
||||
<ActAsMask />
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="ActAs__text"
|
||||
>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
size="small"
|
||||
>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
padding="0 0 x-small 0"
|
||||
textAlign="center"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="x-large"
|
||||
weight="light"
|
||||
>
|
||||
Act as foo
|
||||
</Text>
|
||||
</View>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
textAlign="center"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
lineHeight="condensed"
|
||||
size="small"
|
||||
>
|
||||
"Act as" is essentially logging in as this user without a password. You will be able to take any action as if you were this user, and from other users' points of views, it will be as if this user performed them. However, audit logs record that you were the one who performed the actions on behalf of this user.
|
||||
</Text>
|
||||
</View>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
textAlign="center"
|
||||
>
|
||||
<Avatar
|
||||
inline={true}
|
||||
margin="medium 0 x-small 0"
|
||||
name="foo"
|
||||
size="small"
|
||||
src="testImageUrl"
|
||||
variant="circle"
|
||||
/>
|
||||
</View>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
textAlign="center"
|
||||
>
|
||||
<Table
|
||||
caption={
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
User details
|
||||
</ScreenReaderContent>
|
||||
}
|
||||
hover={false}
|
||||
size="medium"
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
Category
|
||||
</ScreenReaderContent>
|
||||
</th>
|
||||
<th>
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
User information
|
||||
</ScreenReaderContent>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
Full Name:
|
||||
</Text>
|
||||
</td>
|
||||
<td>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
textAlign="end"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
test user
|
||||
</Text>
|
||||
</View>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
Display Name:
|
||||
</Text>
|
||||
</td>
|
||||
<td>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
textAlign="end"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
foo
|
||||
</Text>
|
||||
</View>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
Sortable Name:
|
||||
</Text>
|
||||
</td>
|
||||
<td>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
textAlign="end"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
bar, baz
|
||||
</Text>
|
||||
</View>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
Default Email:
|
||||
</Text>
|
||||
</td>
|
||||
<td>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
textAlign="end"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
testUser@test.com
|
||||
</Text>
|
||||
</View>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</Table>
|
||||
</View>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
key="qux"
|
||||
margin="large 0 0 0"
|
||||
textAlign="center"
|
||||
>
|
||||
<Table
|
||||
caption={
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
Login info
|
||||
</ScreenReaderContent>
|
||||
}
|
||||
hover={false}
|
||||
size="medium"
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
Category
|
||||
</ScreenReaderContent>
|
||||
</th>
|
||||
<th>
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
User information
|
||||
</ScreenReaderContent>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
Login ID:
|
||||
</Text>
|
||||
</td>
|
||||
<td>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
textAlign="end"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
qux
|
||||
</Text>
|
||||
</View>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
SIS ID:
|
||||
</Text>
|
||||
</td>
|
||||
<td>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
textAlign="end"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
555
|
||||
</Text>
|
||||
</View>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
Integration ID:
|
||||
</Text>
|
||||
</td>
|
||||
<td>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
textAlign="end"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
222
|
||||
</Text>
|
||||
</View>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</Table>
|
||||
</View>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
key="tic"
|
||||
margin="large 0 0 0"
|
||||
textAlign="center"
|
||||
>
|
||||
<Table
|
||||
caption={
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
Login info
|
||||
</ScreenReaderContent>
|
||||
}
|
||||
hover={false}
|
||||
size="medium"
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
Category
|
||||
</ScreenReaderContent>
|
||||
</th>
|
||||
<th>
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
User information
|
||||
</ScreenReaderContent>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
Login ID:
|
||||
</Text>
|
||||
</td>
|
||||
<td>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
textAlign="end"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
tic
|
||||
</Text>
|
||||
</View>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
SIS ID:
|
||||
</Text>
|
||||
</td>
|
||||
<td>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
textAlign="end"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
777
|
||||
</Text>
|
||||
</View>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
Integration ID:
|
||||
</Text>
|
||||
</td>
|
||||
<td>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
textAlign="end"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
888
|
||||
</Text>
|
||||
</View>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</Table>
|
||||
</View>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
textAlign="center"
|
||||
>
|
||||
<Button
|
||||
as="button"
|
||||
buttonRef={[Function]}
|
||||
cursor="pointer"
|
||||
data-method="post"
|
||||
fluidWidth={false}
|
||||
href="/users/5/masquerade"
|
||||
margin="large 0 0 0"
|
||||
onClick={[Function]}
|
||||
size="medium"
|
||||
type="button"
|
||||
variant="primary"
|
||||
>
|
||||
Proceed
|
||||
</Button>
|
||||
</View>
|
||||
</View>
|
||||
</div>
|
||||
</div>
|
||||
</ModalBody>
|
||||
</CanvasInstUIModal>
|
||||
</div>
|
||||
`;
|
||||
|
|
@ -51,7 +51,7 @@ const defaultProps = (props = {}) => (
|
|||
|
||||
it('renders the AlignmentResult component', () => {
|
||||
const wrapper = shallow(<AssignmentResult {...defaultProps()}/>)
|
||||
expect(wrapper.debug()).toMatchSnapshot()
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('includes the assignment name', () => {
|
||||
|
|
|
|||
|
|
@ -76,19 +76,19 @@ const defaultProps = (props = {}) => (
|
|||
|
||||
it('renders the Outcome component', () => {
|
||||
const wrapper = shallow(<Outcome {...defaultProps()}/>)
|
||||
expect(wrapper.debug()).toMatchSnapshot()
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('renders correctly expanded', () => {
|
||||
const wrapper = shallow(<Outcome {...defaultProps()} expanded />)
|
||||
expect(wrapper.debug()).toMatchSnapshot()
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('renders correctly expanded with no results', () => {
|
||||
const props = defaultProps()
|
||||
props.outcome.results = []
|
||||
const wrapper = shallow(<Outcome {...props} expanded />)
|
||||
expect(wrapper.debug()).toMatchSnapshot()
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('renders correctly expanded with no results or assignments', () => {
|
||||
|
|
@ -96,7 +96,7 @@ it('renders correctly expanded with no results or assignments', () => {
|
|||
props.outcome.results = []
|
||||
props.outcome.assignments = []
|
||||
const wrapper = shallow(<Outcome {...props} expanded />)
|
||||
expect(wrapper.debug()).toMatchSnapshot()
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
describe('header', () => {
|
||||
|
|
|
|||
|
|
@ -89,7 +89,7 @@ const defaultProps = (props = {}) => (
|
|||
|
||||
it('renders the OutcomeGroup component', () => {
|
||||
const wrapper = shallow(<OutcomeGroup {...defaultProps()}/>)
|
||||
expect(wrapper.debug()).toMatchSnapshot()
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
describe('header', () => {
|
||||
|
|
@ -108,7 +108,7 @@ it('includes the individual outcomes', () => {
|
|||
|
||||
it('renders correctly expanded', () => {
|
||||
const wrapper = shallow(<OutcomeGroup {...defaultProps()} expanded />)
|
||||
expect(wrapper.debug()).toMatchSnapshot()
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('renders outcomes in alphabetical order by title', () => {
|
||||
|
|
|
|||
|
|
@ -80,21 +80,21 @@ const defaultProps = (props = {}) => (
|
|||
|
||||
it('renders the OutcomePopover component', () => {
|
||||
const wrapper = shallow(<OutcomePopover {...defaultProps()}/>)
|
||||
expect(wrapper.debug()).toMatchSnapshot()
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('renders correctly with no results', () => {
|
||||
const props = defaultProps()
|
||||
props.outcome.results = []
|
||||
const wrapper = shallow(<OutcomePopover {...props}/>)
|
||||
expect(wrapper.debug()).toMatchSnapshot()
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('renders correctly with no custom outcomeProficiency', () => {
|
||||
const props = defaultProps()
|
||||
props.outcomeProficiency = null
|
||||
const wrapper = shallow(<OutcomePopover {...props}/>)
|
||||
expect(wrapper.debug()).toMatchSnapshot()
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('properly expands details for screenreader users', () => {
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ import UnassessedAssignment from '../UnassessedAssignment'
|
|||
it('properly renders the UnassessedAssignment component', () => {
|
||||
const props = { assignment: {id: 1, title: 'example', url: 'www.example.com' }}
|
||||
const wrapper = shallow(<UnassessedAssignment {...props}/>)
|
||||
expect(wrapper.debug()).toMatchSnapshot()
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('properly renders with a quiz icon when submission type is online quiz', () => {
|
||||
|
|
|
|||
|
|
@ -1,36 +1,125 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`renders the AlignmentResult component 1`] = `
|
||||
"<Flex padding=\\"small\\" direction=\\"column\\" alignItems=\\"stretch\\" as=\\"span\\" justifyItems=\\"start\\" inline={false} visualDebug={false} wrapItems={false}>
|
||||
<FlexItem as=\\"span\\" grow={false} shrink={false}>
|
||||
<Link href=\\"http://foo\\" variant=\\"default\\" as=\\"button\\" linkRef={[Function: linkRef]} ellipsis={false} iconPlacement=\\"start\\">
|
||||
<Flex alignItems=\\"center\\" as=\\"span\\" direction=\\"row\\" justifyItems=\\"start\\" inline={false} visualDebug={false} wrapItems={false}>
|
||||
<FlexItem as=\\"span\\" grow={false} shrink={false}>
|
||||
<Text size=\\"medium\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<Flex
|
||||
alignItems="stretch"
|
||||
as="span"
|
||||
direction="column"
|
||||
inline={false}
|
||||
justifyItems="start"
|
||||
padding="small"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Link
|
||||
as="button"
|
||||
ellipsis={false}
|
||||
href="http://foo"
|
||||
iconPlacement="start"
|
||||
linkRef={[Function]}
|
||||
variant="default"
|
||||
>
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="start"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="medium"
|
||||
>
|
||||
<IconQuiz />
|
||||
</Text>
|
||||
</FlexItem>
|
||||
<FlexItem padding=\\"0 x-small\\" as=\\"span\\" grow={false} shrink={false}>
|
||||
<Text weight=\\"bold\\" as=\\"span\\" size=\\"medium\\" letterSpacing=\\"normal\\">
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
padding="0 x-small"
|
||||
shrink={false}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="medium"
|
||||
weight="bold"
|
||||
>
|
||||
My assignment
|
||||
</Text>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
</Link>
|
||||
</FlexItem>
|
||||
<FlexItem padding=\\"x-small 0\\" as=\\"span\\" grow={false} shrink={false}>
|
||||
<View padding=\\"x-small 0 0 0\\" display=\\"auto\\">
|
||||
<Text size=\\"small\\" fontStyle=\\"italic\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
padding="x-small 0"
|
||||
shrink={false}
|
||||
>
|
||||
<View
|
||||
display="auto"
|
||||
padding="x-small 0 0 0"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
fontStyle="italic"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
Your score: 1
|
||||
</Text>
|
||||
</View>
|
||||
</FlexItem>
|
||||
<FlexItem borderWidth=\\"small\\" as=\\"span\\" grow={false} shrink={false}>
|
||||
<div className=\\"react-rubric\\">
|
||||
<div className=\\"ratings\\">
|
||||
<Ratings tiers={{...}} points={1} hidePoints={false} useRange={false} customRatings={[undefined]} defaultMasteryThreshold={3} pointsPossible={5} assessing={false} isSummary={false} footer={{...}} onPointChange={[Function: onPointChange]} />
|
||||
<FlexItem
|
||||
as="span"
|
||||
borderWidth="small"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<div
|
||||
className="react-rubric"
|
||||
>
|
||||
<div
|
||||
className="ratings"
|
||||
>
|
||||
<Ratings
|
||||
assessing={false}
|
||||
defaultMasteryThreshold={3}
|
||||
footer={null}
|
||||
hidePoints={false}
|
||||
isSummary={false}
|
||||
onPointChange={[Function]}
|
||||
points={1}
|
||||
pointsPossible={5}
|
||||
tiers={
|
||||
Array [
|
||||
Object {
|
||||
"description": "My first rating",
|
||||
},
|
||||
Object {
|
||||
"description": "My second rating",
|
||||
},
|
||||
]
|
||||
}
|
||||
useRange={false}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</FlexItem>
|
||||
</Flex>"
|
||||
</Flex>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -1,39 +1,805 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`renders correctly expanded 1`] = `
|
||||
"<ToggleGroup summary={{...}} toggleLabel=\\"Toggle alignment details for My outcome\\" expanded={true} onToggle={[Function]} border={false} size=\\"medium\\" icon={[Function: IconArrowOpenEnd]} iconExpanded={[Function: IconArrowOpenDown]} defaultExpanded={false} transition={true} as=\\"span\\" elementRef={[Function: elementRef]}>
|
||||
<List variant=\\"unstyled\\" delimiter=\\"dashed\\" as=\\"ul\\" margin=\\"none\\" size=\\"medium\\">
|
||||
<ListItem>
|
||||
<AssignmentResult result={{...}} outcome={{...}} outcomeProficiency={{...}} />
|
||||
<ToggleGroup
|
||||
as="span"
|
||||
border={false}
|
||||
defaultExpanded={false}
|
||||
elementRef={[Function]}
|
||||
expanded={true}
|
||||
icon={[Function]}
|
||||
iconExpanded={[Function]}
|
||||
onToggle={[Function]}
|
||||
size="medium"
|
||||
summary={
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
data-selenium="outcome"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="space-between"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={true}
|
||||
>
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="column"
|
||||
inline={false}
|
||||
justifyItems="start"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="medium"
|
||||
>
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="start"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<OutcomePopover
|
||||
outcome={
|
||||
Object {
|
||||
"assignments": Array [
|
||||
Object {
|
||||
"assignment_id": 1,
|
||||
"learning_outcome_id": 1,
|
||||
"submission_types": "online_quiz",
|
||||
"title": "My assignment",
|
||||
"url": "www.example.com",
|
||||
},
|
||||
],
|
||||
"calculation_method": "highest",
|
||||
"expansionId": 100,
|
||||
"id": 1,
|
||||
"mastered": false,
|
||||
"mastery_points": 3,
|
||||
"points_possible": 5,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"description": "My first rating",
|
||||
},
|
||||
Object {
|
||||
"description": "My second rating",
|
||||
},
|
||||
],
|
||||
"results": Array [
|
||||
Object {
|
||||
"assignment": Object {
|
||||
"html_url": "http://foo",
|
||||
"id": "assignment_1",
|
||||
"name": "My assignment",
|
||||
"score": 0,
|
||||
"submission_types": "online_quiz",
|
||||
},
|
||||
"id": 1,
|
||||
"percent": 0.1,
|
||||
"score": 1,
|
||||
},
|
||||
],
|
||||
"title": "My outcome",
|
||||
}
|
||||
}
|
||||
outcomeProficiency={null}
|
||||
/>
|
||||
</FlexItem>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
padding="0 x-small"
|
||||
shrink={true}
|
||||
>
|
||||
<TruncateText
|
||||
debounce={0}
|
||||
ellipsis="…"
|
||||
ignore={
|
||||
Array [
|
||||
" ",
|
||||
".",
|
||||
",",
|
||||
]
|
||||
}
|
||||
maxLines={1}
|
||||
onUpdate={[Function]}
|
||||
position="end"
|
||||
truncate="character"
|
||||
>
|
||||
My outcome
|
||||
</TruncateText>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
</Text>
|
||||
</FlexItem>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
1 alignment
|
||||
</Text>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
</FlexItem>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Pill
|
||||
text="Not mastered"
|
||||
variant="default"
|
||||
/>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
}
|
||||
toggleLabel="Toggle alignment details for My outcome"
|
||||
transition={true}
|
||||
>
|
||||
<List
|
||||
as="ul"
|
||||
delimiter="dashed"
|
||||
margin="none"
|
||||
size="medium"
|
||||
variant="unstyled"
|
||||
>
|
||||
<ListItem
|
||||
key="1"
|
||||
>
|
||||
<AssignmentResult
|
||||
outcome={
|
||||
Object {
|
||||
"assignments": Array [
|
||||
Object {
|
||||
"assignment_id": 1,
|
||||
"learning_outcome_id": 1,
|
||||
"submission_types": "online_quiz",
|
||||
"title": "My assignment",
|
||||
"url": "www.example.com",
|
||||
},
|
||||
],
|
||||
"calculation_method": "highest",
|
||||
"expansionId": 100,
|
||||
"id": 1,
|
||||
"mastered": false,
|
||||
"mastery_points": 3,
|
||||
"points_possible": 5,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"description": "My first rating",
|
||||
},
|
||||
Object {
|
||||
"description": "My second rating",
|
||||
},
|
||||
],
|
||||
"results": Array [
|
||||
Object {
|
||||
"assignment": Object {
|
||||
"html_url": "http://foo",
|
||||
"id": "assignment_1",
|
||||
"name": "My assignment",
|
||||
"score": 0,
|
||||
"submission_types": "online_quiz",
|
||||
},
|
||||
"id": 1,
|
||||
"percent": 0.1,
|
||||
"score": 1,
|
||||
},
|
||||
],
|
||||
"title": "My outcome",
|
||||
}
|
||||
}
|
||||
outcomeProficiency={null}
|
||||
result={
|
||||
Object {
|
||||
"assignment": Object {
|
||||
"html_url": "http://foo",
|
||||
"id": "assignment_1",
|
||||
"name": "My assignment",
|
||||
"score": 0,
|
||||
"submission_types": "online_quiz",
|
||||
},
|
||||
"id": 1,
|
||||
"percent": 0.1,
|
||||
"score": 1,
|
||||
}
|
||||
}
|
||||
/>
|
||||
</ListItem>
|
||||
</List>
|
||||
</ToggleGroup>"
|
||||
</ToggleGroup>
|
||||
`;
|
||||
|
||||
exports[`renders correctly expanded with no results 1`] = `
|
||||
"<ToggleGroup summary={{...}} toggleLabel=\\"Toggle alignment details for My outcome\\" expanded={true} onToggle={[Function]} border={false} size=\\"medium\\" icon={[Function: IconArrowOpenEnd]} iconExpanded={[Function: IconArrowOpenDown]} defaultExpanded={false} transition={true} as=\\"span\\" elementRef={[Function: elementRef]}>
|
||||
<List variant=\\"unstyled\\" delimiter=\\"dashed\\" as=\\"ul\\" margin=\\"none\\" size=\\"medium\\">
|
||||
<UnassessedAssignment assignment={{...}} />
|
||||
<ToggleGroup
|
||||
as="span"
|
||||
border={false}
|
||||
defaultExpanded={false}
|
||||
elementRef={[Function]}
|
||||
expanded={true}
|
||||
icon={[Function]}
|
||||
iconExpanded={[Function]}
|
||||
onToggle={[Function]}
|
||||
size="medium"
|
||||
summary={
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
data-selenium="outcome"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="space-between"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={true}
|
||||
>
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="column"
|
||||
inline={false}
|
||||
justifyItems="start"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="medium"
|
||||
>
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="start"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<OutcomePopover
|
||||
outcome={
|
||||
Object {
|
||||
"assignments": Array [
|
||||
Object {
|
||||
"assignment_id": 1,
|
||||
"learning_outcome_id": 1,
|
||||
"submission_types": "online_quiz",
|
||||
"title": "My assignment",
|
||||
"url": "www.example.com",
|
||||
},
|
||||
],
|
||||
"calculation_method": "highest",
|
||||
"expansionId": 100,
|
||||
"id": 1,
|
||||
"mastered": false,
|
||||
"mastery_points": 3,
|
||||
"points_possible": 5,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"description": "My first rating",
|
||||
},
|
||||
Object {
|
||||
"description": "My second rating",
|
||||
},
|
||||
],
|
||||
"results": Array [],
|
||||
"title": "My outcome",
|
||||
}
|
||||
}
|
||||
outcomeProficiency={null}
|
||||
/>
|
||||
</FlexItem>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
padding="0 x-small"
|
||||
shrink={true}
|
||||
>
|
||||
<TruncateText
|
||||
debounce={0}
|
||||
ellipsis="…"
|
||||
ignore={
|
||||
Array [
|
||||
" ",
|
||||
".",
|
||||
",",
|
||||
]
|
||||
}
|
||||
maxLines={1}
|
||||
onUpdate={[Function]}
|
||||
position="end"
|
||||
truncate="character"
|
||||
>
|
||||
My outcome
|
||||
</TruncateText>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
</Text>
|
||||
</FlexItem>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
1 alignment
|
||||
</Text>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
</FlexItem>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Pill
|
||||
text="Not mastered"
|
||||
variant="default"
|
||||
/>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
}
|
||||
toggleLabel="Toggle alignment details for My outcome"
|
||||
transition={true}
|
||||
>
|
||||
<List
|
||||
as="ul"
|
||||
delimiter="dashed"
|
||||
margin="none"
|
||||
size="medium"
|
||||
variant="unstyled"
|
||||
>
|
||||
<UnassessedAssignment
|
||||
assignment={
|
||||
Object {
|
||||
"assignment_id": 1,
|
||||
"learning_outcome_id": 1,
|
||||
"submission_types": "online_quiz",
|
||||
"title": "My assignment",
|
||||
"url": "www.example.com",
|
||||
}
|
||||
}
|
||||
/>
|
||||
</List>
|
||||
</ToggleGroup>"
|
||||
</ToggleGroup>
|
||||
`;
|
||||
|
||||
exports[`renders correctly expanded with no results or assignments 1`] = `
|
||||
"<ToggleGroup summary={{...}} toggleLabel=\\"Toggle alignment details for My outcome\\" expanded={true} onToggle={[Function]} border={false} size=\\"medium\\" icon={[Function: IconArrowOpenEnd]} iconExpanded={[Function: IconArrowOpenDown]} defaultExpanded={false} transition={true} as=\\"span\\" elementRef={[Function: elementRef]}>
|
||||
<View as=\\"div\\" padding=\\"small\\" display=\\"auto\\">
|
||||
<Text as=\\"span\\" size=\\"medium\\" letterSpacing=\\"normal\\">
|
||||
<ToggleGroup
|
||||
as="span"
|
||||
border={false}
|
||||
defaultExpanded={false}
|
||||
elementRef={[Function]}
|
||||
expanded={true}
|
||||
icon={[Function]}
|
||||
iconExpanded={[Function]}
|
||||
onToggle={[Function]}
|
||||
size="medium"
|
||||
summary={
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
data-selenium="outcome"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="space-between"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={true}
|
||||
>
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="column"
|
||||
inline={false}
|
||||
justifyItems="start"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="medium"
|
||||
>
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="start"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<OutcomePopover
|
||||
outcome={
|
||||
Object {
|
||||
"assignments": Array [],
|
||||
"calculation_method": "highest",
|
||||
"expansionId": 100,
|
||||
"id": 1,
|
||||
"mastered": false,
|
||||
"mastery_points": 3,
|
||||
"points_possible": 5,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"description": "My first rating",
|
||||
},
|
||||
Object {
|
||||
"description": "My second rating",
|
||||
},
|
||||
],
|
||||
"results": Array [],
|
||||
"title": "My outcome",
|
||||
}
|
||||
}
|
||||
outcomeProficiency={null}
|
||||
/>
|
||||
</FlexItem>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
padding="0 x-small"
|
||||
shrink={true}
|
||||
>
|
||||
<TruncateText
|
||||
debounce={0}
|
||||
ellipsis="…"
|
||||
ignore={
|
||||
Array [
|
||||
" ",
|
||||
".",
|
||||
",",
|
||||
]
|
||||
}
|
||||
maxLines={1}
|
||||
onUpdate={[Function]}
|
||||
position="end"
|
||||
truncate="character"
|
||||
>
|
||||
My outcome
|
||||
</TruncateText>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
</Text>
|
||||
</FlexItem>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
No alignments
|
||||
</Text>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
</FlexItem>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Pill
|
||||
text="Not mastered"
|
||||
variant="default"
|
||||
/>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
}
|
||||
toggleLabel="Toggle alignment details for My outcome"
|
||||
transition={true}
|
||||
>
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
padding="small"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="medium"
|
||||
>
|
||||
No alignments are available for this outcome.
|
||||
</Text>
|
||||
</View>
|
||||
</ToggleGroup>"
|
||||
</ToggleGroup>
|
||||
`;
|
||||
|
||||
exports[`renders the Outcome component 1`] = `
|
||||
"<ToggleGroup summary={{...}} toggleLabel=\\"Toggle alignment details for My outcome\\" expanded={false} onToggle={[Function]} border={false} size=\\"medium\\" icon={[Function: IconArrowOpenEnd]} iconExpanded={[Function: IconArrowOpenDown]} defaultExpanded={false} transition={true} as=\\"span\\" elementRef={[Function: elementRef]}>
|
||||
<List variant=\\"unstyled\\" delimiter=\\"dashed\\" as=\\"ul\\" margin=\\"none\\" size=\\"medium\\">
|
||||
<ListItem>
|
||||
<AssignmentResult result={{...}} outcome={{...}} outcomeProficiency={{...}} />
|
||||
<ToggleGroup
|
||||
as="span"
|
||||
border={false}
|
||||
defaultExpanded={false}
|
||||
elementRef={[Function]}
|
||||
expanded={false}
|
||||
icon={[Function]}
|
||||
iconExpanded={[Function]}
|
||||
onToggle={[Function]}
|
||||
size="medium"
|
||||
summary={
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
data-selenium="outcome"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="space-between"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={true}
|
||||
>
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="column"
|
||||
inline={false}
|
||||
justifyItems="start"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="medium"
|
||||
>
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="start"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<OutcomePopover
|
||||
outcome={
|
||||
Object {
|
||||
"assignments": Array [
|
||||
Object {
|
||||
"assignment_id": 1,
|
||||
"learning_outcome_id": 1,
|
||||
"submission_types": "online_quiz",
|
||||
"title": "My assignment",
|
||||
"url": "www.example.com",
|
||||
},
|
||||
],
|
||||
"calculation_method": "highest",
|
||||
"expansionId": 100,
|
||||
"id": 1,
|
||||
"mastered": false,
|
||||
"mastery_points": 3,
|
||||
"points_possible": 5,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"description": "My first rating",
|
||||
},
|
||||
Object {
|
||||
"description": "My second rating",
|
||||
},
|
||||
],
|
||||
"results": Array [
|
||||
Object {
|
||||
"assignment": Object {
|
||||
"html_url": "http://foo",
|
||||
"id": "assignment_1",
|
||||
"name": "My assignment",
|
||||
"score": 0,
|
||||
"submission_types": "online_quiz",
|
||||
},
|
||||
"id": 1,
|
||||
"percent": 0.1,
|
||||
"score": 1,
|
||||
},
|
||||
],
|
||||
"title": "My outcome",
|
||||
}
|
||||
}
|
||||
outcomeProficiency={null}
|
||||
/>
|
||||
</FlexItem>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
padding="0 x-small"
|
||||
shrink={true}
|
||||
>
|
||||
<TruncateText
|
||||
debounce={0}
|
||||
ellipsis="…"
|
||||
ignore={
|
||||
Array [
|
||||
" ",
|
||||
".",
|
||||
",",
|
||||
]
|
||||
}
|
||||
maxLines={1}
|
||||
onUpdate={[Function]}
|
||||
position="end"
|
||||
truncate="character"
|
||||
>
|
||||
My outcome
|
||||
</TruncateText>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
</Text>
|
||||
</FlexItem>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
1 alignment
|
||||
</Text>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
</FlexItem>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Pill
|
||||
text="Not mastered"
|
||||
variant="default"
|
||||
/>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
}
|
||||
toggleLabel="Toggle alignment details for My outcome"
|
||||
transition={true}
|
||||
>
|
||||
<List
|
||||
as="ul"
|
||||
delimiter="dashed"
|
||||
margin="none"
|
||||
size="medium"
|
||||
variant="unstyled"
|
||||
>
|
||||
<ListItem
|
||||
key="1"
|
||||
>
|
||||
<AssignmentResult
|
||||
outcome={
|
||||
Object {
|
||||
"assignments": Array [
|
||||
Object {
|
||||
"assignment_id": 1,
|
||||
"learning_outcome_id": 1,
|
||||
"submission_types": "online_quiz",
|
||||
"title": "My assignment",
|
||||
"url": "www.example.com",
|
||||
},
|
||||
],
|
||||
"calculation_method": "highest",
|
||||
"expansionId": 100,
|
||||
"id": 1,
|
||||
"mastered": false,
|
||||
"mastery_points": 3,
|
||||
"points_possible": 5,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"description": "My first rating",
|
||||
},
|
||||
Object {
|
||||
"description": "My second rating",
|
||||
},
|
||||
],
|
||||
"results": Array [
|
||||
Object {
|
||||
"assignment": Object {
|
||||
"html_url": "http://foo",
|
||||
"id": "assignment_1",
|
||||
"name": "My assignment",
|
||||
"score": 0,
|
||||
"submission_types": "online_quiz",
|
||||
},
|
||||
"id": 1,
|
||||
"percent": 0.1,
|
||||
"score": 1,
|
||||
},
|
||||
],
|
||||
"title": "My outcome",
|
||||
}
|
||||
}
|
||||
outcomeProficiency={null}
|
||||
result={
|
||||
Object {
|
||||
"assignment": Object {
|
||||
"html_url": "http://foo",
|
||||
"id": "assignment_1",
|
||||
"name": "My assignment",
|
||||
"score": 0,
|
||||
"submission_types": "online_quiz",
|
||||
},
|
||||
"id": 1,
|
||||
"percent": 0.1,
|
||||
"score": 1,
|
||||
}
|
||||
}
|
||||
/>
|
||||
</ListItem>
|
||||
</List>
|
||||
</ToggleGroup>"
|
||||
</ToggleGroup>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -1,25 +1,221 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`renders correctly expanded 1`] = `
|
||||
"<View as=\\"div\\" className=\\"outcomeGroup\\" display=\\"auto\\">
|
||||
<ToggleGroup summary={{...}} toggleLabel=\\"Toggle outcomes for My group\\" expanded={true} onToggle={[Function]} size=\\"medium\\" icon={[Function: IconArrowOpenEnd]} iconExpanded={[Function: IconArrowOpenDown]} defaultExpanded={false} transition={true} as=\\"span\\" elementRef={[Function: elementRef]} border={true}>
|
||||
<List variant=\\"unstyled\\" delimiter=\\"solid\\" as=\\"ul\\" margin=\\"none\\" size=\\"medium\\">
|
||||
<ListItem margin=\\"0\\">
|
||||
<Outcome outcome={{...}} expanded={false} onExpansionChange={[Function: onExpansionChange]} outcomeProficiency={{...}} />
|
||||
<View
|
||||
as="div"
|
||||
className="outcomeGroup"
|
||||
display="auto"
|
||||
>
|
||||
<ToggleGroup
|
||||
as="span"
|
||||
border={true}
|
||||
defaultExpanded={false}
|
||||
elementRef={[Function]}
|
||||
expanded={true}
|
||||
icon={[Function]}
|
||||
iconExpanded={[Function]}
|
||||
onToggle={[Function]}
|
||||
size="medium"
|
||||
summary={
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="space-between"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
padding="0 x-small 0 0"
|
||||
shrink={false}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="large"
|
||||
weight="bold"
|
||||
>
|
||||
My group
|
||||
</Text>
|
||||
</FlexItem>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Pill
|
||||
text="0 of 1 Mastered"
|
||||
variant="default"
|
||||
/>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
}
|
||||
toggleLabel="Toggle outcomes for My group"
|
||||
transition={true}
|
||||
>
|
||||
<List
|
||||
as="ul"
|
||||
delimiter="solid"
|
||||
margin="none"
|
||||
size="medium"
|
||||
variant="unstyled"
|
||||
>
|
||||
<ListItem
|
||||
key="1"
|
||||
margin="0"
|
||||
>
|
||||
<Outcome
|
||||
expanded={false}
|
||||
onExpansionChange={[Function]}
|
||||
outcome={
|
||||
Object {
|
||||
"calculation_method": "highest",
|
||||
"expansionId": 100,
|
||||
"id": 1,
|
||||
"mastered": false,
|
||||
"mastery_points": 3,
|
||||
"points_possible": 5,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"description": "My first rating",
|
||||
},
|
||||
Object {
|
||||
"description": "My second rating",
|
||||
},
|
||||
],
|
||||
"results": Array [
|
||||
Object {
|
||||
"assignment": Object {
|
||||
"html_url": "http://foo",
|
||||
"id": 1,
|
||||
"name": "My assignment",
|
||||
"submission_types": "online_quiz",
|
||||
},
|
||||
"id": 1,
|
||||
"percent": 0.1,
|
||||
"score": 1,
|
||||
},
|
||||
],
|
||||
"title": "My outcome",
|
||||
}
|
||||
}
|
||||
outcomeProficiency={null}
|
||||
/>
|
||||
</ListItem>
|
||||
</List>
|
||||
</ToggleGroup>
|
||||
</View>"
|
||||
</View>
|
||||
`;
|
||||
|
||||
exports[`renders the OutcomeGroup component 1`] = `
|
||||
"<View as=\\"div\\" className=\\"outcomeGroup\\" display=\\"auto\\">
|
||||
<ToggleGroup summary={{...}} toggleLabel=\\"Toggle outcomes for My group\\" expanded={false} onToggle={[Function]} size=\\"medium\\" icon={[Function: IconArrowOpenEnd]} iconExpanded={[Function: IconArrowOpenDown]} defaultExpanded={false} transition={true} as=\\"span\\" elementRef={[Function: elementRef]} border={true}>
|
||||
<List variant=\\"unstyled\\" delimiter=\\"solid\\" as=\\"ul\\" margin=\\"none\\" size=\\"medium\\">
|
||||
<ListItem margin=\\"0\\">
|
||||
<Outcome outcome={{...}} expanded={false} onExpansionChange={[Function: onExpansionChange]} outcomeProficiency={{...}} />
|
||||
<View
|
||||
as="div"
|
||||
className="outcomeGroup"
|
||||
display="auto"
|
||||
>
|
||||
<ToggleGroup
|
||||
as="span"
|
||||
border={true}
|
||||
defaultExpanded={false}
|
||||
elementRef={[Function]}
|
||||
expanded={false}
|
||||
icon={[Function]}
|
||||
iconExpanded={[Function]}
|
||||
onToggle={[Function]}
|
||||
size="medium"
|
||||
summary={
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="space-between"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
padding="0 x-small 0 0"
|
||||
shrink={false}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="large"
|
||||
weight="bold"
|
||||
>
|
||||
My group
|
||||
</Text>
|
||||
</FlexItem>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Pill
|
||||
text="0 of 1 Mastered"
|
||||
variant="default"
|
||||
/>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
}
|
||||
toggleLabel="Toggle outcomes for My group"
|
||||
transition={true}
|
||||
>
|
||||
<List
|
||||
as="ul"
|
||||
delimiter="solid"
|
||||
margin="none"
|
||||
size="medium"
|
||||
variant="unstyled"
|
||||
>
|
||||
<ListItem
|
||||
key="1"
|
||||
margin="0"
|
||||
>
|
||||
<Outcome
|
||||
expanded={false}
|
||||
onExpansionChange={[Function]}
|
||||
outcome={
|
||||
Object {
|
||||
"calculation_method": "highest",
|
||||
"expansionId": 100,
|
||||
"id": 1,
|
||||
"mastered": false,
|
||||
"mastery_points": 3,
|
||||
"points_possible": 5,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"description": "My first rating",
|
||||
},
|
||||
Object {
|
||||
"description": "My second rating",
|
||||
},
|
||||
],
|
||||
"results": Array [
|
||||
Object {
|
||||
"assignment": Object {
|
||||
"html_url": "http://foo",
|
||||
"id": 1,
|
||||
"name": "My assignment",
|
||||
"submission_types": "online_quiz",
|
||||
},
|
||||
"id": 1,
|
||||
"percent": 0.1,
|
||||
"score": 1,
|
||||
},
|
||||
],
|
||||
"title": "My outcome",
|
||||
}
|
||||
}
|
||||
outcomeProficiency={null}
|
||||
/>
|
||||
</ListItem>
|
||||
</List>
|
||||
</ToggleGroup>
|
||||
</View>"
|
||||
</View>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -1,50 +1,163 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`renders correctly with no custom outcomeProficiency 1`] = `
|
||||
"<span>
|
||||
<Popover placement=\\"bottom\\" onToggle={[Function: onToggle]} onClick={[Function: onClick]} onFocus={[Function: onFocus]} onBlur={[Function: onBlur]} onMouseOver={[Function: onMouseOver]} onMouseOut={[Function: onMouseOut]} onShow={[Function: onShow]} onDismiss={[Function: onDismiss]} stacking=\\"topmost\\" offsetX={0} offsetY={0} variant=\\"default\\" on={{...}} contentRef={[Function: contentRef]} defaultShow={false} withArrow={true} trackPosition={true} constrain=\\"window\\" onPositioned={[Function: onPositioned]} onPositionChanged={[Function: onPositionChanged]} shouldRenderOffscreen={false} shouldContainFocus={false} shouldReturnFocus={true} shouldCloseOnDocumentClick={true} shouldCloseOnEscape={true} defaultFocusElement={{...}} label={{...}} mountNode={{...}} insertAt=\\"bottom\\" liveRegion={{...}} positionTarget={{...}} alignArrow={false}>
|
||||
<span>
|
||||
<Popover
|
||||
alignArrow={false}
|
||||
constrain="window"
|
||||
contentRef={[Function]}
|
||||
defaultFocusElement={null}
|
||||
defaultShow={false}
|
||||
insertAt="bottom"
|
||||
label={null}
|
||||
liveRegion={null}
|
||||
mountNode={null}
|
||||
offsetX={0}
|
||||
offsetY={0}
|
||||
on={
|
||||
Array [
|
||||
"hover",
|
||||
"focus",
|
||||
]
|
||||
}
|
||||
onBlur={[Function]}
|
||||
onClick={[Function]}
|
||||
onDismiss={[Function]}
|
||||
onFocus={[Function]}
|
||||
onMouseOut={[Function]}
|
||||
onMouseOver={[Function]}
|
||||
onPositionChanged={[Function]}
|
||||
onPositioned={[Function]}
|
||||
onShow={[Function]}
|
||||
onToggle={[Function]}
|
||||
placement="bottom"
|
||||
positionTarget={null}
|
||||
shouldCloseOnDocumentClick={true}
|
||||
shouldCloseOnEscape={true}
|
||||
shouldContainFocus={false}
|
||||
shouldRenderOffscreen={false}
|
||||
shouldReturnFocus={true}
|
||||
stacking="topmost"
|
||||
trackPosition={true}
|
||||
variant="default"
|
||||
withArrow={true}
|
||||
>
|
||||
<PopoverTrigger>
|
||||
<Link onClick={[Function: onClick]} variant=\\"default\\" as=\\"button\\" linkRef={[Function: linkRef]} ellipsis={false} iconPlacement=\\"start\\">
|
||||
<span style={{...}}>
|
||||
<Link
|
||||
as="button"
|
||||
ellipsis={false}
|
||||
iconPlacement="start"
|
||||
linkRef={[Function]}
|
||||
onClick={[Function]}
|
||||
variant="default"
|
||||
>
|
||||
<span
|
||||
style={
|
||||
Object {
|
||||
"color": "black",
|
||||
}
|
||||
}
|
||||
>
|
||||
<IconInfo />
|
||||
</span>
|
||||
<span>
|
||||
<ScreenReaderContent as=\\"span\\">
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
Click to expand outcome details
|
||||
</ScreenReaderContent>
|
||||
</span>
|
||||
</Link>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent>
|
||||
<View as=\\"div\\" padding=\\"small\\" maxWidth=\\"30rem\\" display=\\"auto\\">
|
||||
<Text size=\\"small\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<Flex alignItems=\\"stretch\\" direction=\\"row\\" justifyItems=\\"space-between\\" as=\\"span\\" inline={false} visualDebug={false} wrapItems={false}>
|
||||
<FlexItem grow={true} shrink={true} as=\\"span\\">
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
maxWidth="30rem"
|
||||
padding="small"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
<Flex
|
||||
alignItems="stretch"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="space-between"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={true}
|
||||
shrink={true}
|
||||
>
|
||||
<div>
|
||||
Last Assessment:
|
||||
<DatetimeDisplay datetime={{...}} format=\\"%b %d, %l:%M %p\\" />
|
||||
<DatetimeDisplay
|
||||
datetime={2018-02-01T07:01:00.000Z}
|
||||
format="%b %d, %l:%M %p"
|
||||
/>
|
||||
</div>
|
||||
</FlexItem>
|
||||
<FlexItem grow={true} shrink={true} align=\\"stretch\\" as=\\"span\\">
|
||||
<Text size=\\"small\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<FlexItem
|
||||
align="stretch"
|
||||
as="span"
|
||||
grow={true}
|
||||
shrink={true}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
<div>
|
||||
<div style={{...}}>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"color": "#00AC18",
|
||||
"textAlign": "end",
|
||||
}
|
||||
}
|
||||
>
|
||||
Meets Mastery
|
||||
</div>
|
||||
</div>
|
||||
</Text>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
<hr role=\\"presentation\\" />
|
||||
<hr
|
||||
role="presentation"
|
||||
/>
|
||||
<div>
|
||||
<Text size=\\"small\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
Calculation Method
|
||||
</Text>
|
||||
<div>
|
||||
Highest Score
|
||||
</div>
|
||||
<div style={{...}}>
|
||||
<Text size=\\"small\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"padding": "0.5rem 0 0 0",
|
||||
}
|
||||
}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
Example
|
||||
</Text>
|
||||
</div>
|
||||
|
|
@ -62,55 +175,169 @@ exports[`renders correctly with no custom outcomeProficiency 1`] = `
|
|||
</View>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
<FlexItem as=\\"span\\" grow={false} shrink={false} />
|
||||
</span>"
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
/>
|
||||
</span>
|
||||
`;
|
||||
|
||||
exports[`renders correctly with no results 1`] = `
|
||||
"<span>
|
||||
<Popover placement=\\"bottom\\" onToggle={[Function: onToggle]} onClick={[Function: onClick]} onFocus={[Function: onFocus]} onBlur={[Function: onBlur]} onMouseOver={[Function: onMouseOver]} onMouseOut={[Function: onMouseOut]} onShow={[Function: onShow]} onDismiss={[Function: onDismiss]} stacking=\\"topmost\\" offsetX={0} offsetY={0} variant=\\"default\\" on={{...}} contentRef={[Function: contentRef]} defaultShow={false} withArrow={true} trackPosition={true} constrain=\\"window\\" onPositioned={[Function: onPositioned]} onPositionChanged={[Function: onPositionChanged]} shouldRenderOffscreen={false} shouldContainFocus={false} shouldReturnFocus={true} shouldCloseOnDocumentClick={true} shouldCloseOnEscape={true} defaultFocusElement={{...}} label={{...}} mountNode={{...}} insertAt=\\"bottom\\" liveRegion={{...}} positionTarget={{...}} alignArrow={false}>
|
||||
<span>
|
||||
<Popover
|
||||
alignArrow={false}
|
||||
constrain="window"
|
||||
contentRef={[Function]}
|
||||
defaultFocusElement={null}
|
||||
defaultShow={false}
|
||||
insertAt="bottom"
|
||||
label={null}
|
||||
liveRegion={null}
|
||||
mountNode={null}
|
||||
offsetX={0}
|
||||
offsetY={0}
|
||||
on={
|
||||
Array [
|
||||
"hover",
|
||||
"focus",
|
||||
]
|
||||
}
|
||||
onBlur={[Function]}
|
||||
onClick={[Function]}
|
||||
onDismiss={[Function]}
|
||||
onFocus={[Function]}
|
||||
onMouseOut={[Function]}
|
||||
onMouseOver={[Function]}
|
||||
onPositionChanged={[Function]}
|
||||
onPositioned={[Function]}
|
||||
onShow={[Function]}
|
||||
onToggle={[Function]}
|
||||
placement="bottom"
|
||||
positionTarget={null}
|
||||
shouldCloseOnDocumentClick={true}
|
||||
shouldCloseOnEscape={true}
|
||||
shouldContainFocus={false}
|
||||
shouldRenderOffscreen={false}
|
||||
shouldReturnFocus={true}
|
||||
stacking="topmost"
|
||||
trackPosition={true}
|
||||
variant="default"
|
||||
withArrow={true}
|
||||
>
|
||||
<PopoverTrigger>
|
||||
<Link onClick={[Function: onClick]} variant=\\"default\\" as=\\"button\\" linkRef={[Function: linkRef]} ellipsis={false} iconPlacement=\\"start\\">
|
||||
<span style={{...}}>
|
||||
<Link
|
||||
as="button"
|
||||
ellipsis={false}
|
||||
iconPlacement="start"
|
||||
linkRef={[Function]}
|
||||
onClick={[Function]}
|
||||
variant="default"
|
||||
>
|
||||
<span
|
||||
style={
|
||||
Object {
|
||||
"color": "black",
|
||||
}
|
||||
}
|
||||
>
|
||||
<IconInfo />
|
||||
</span>
|
||||
<span>
|
||||
<ScreenReaderContent as=\\"span\\">
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
Click to expand outcome details
|
||||
</ScreenReaderContent>
|
||||
</span>
|
||||
</Link>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent>
|
||||
<View as=\\"div\\" padding=\\"small\\" maxWidth=\\"30rem\\" display=\\"auto\\">
|
||||
<Text size=\\"small\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<Flex alignItems=\\"stretch\\" direction=\\"row\\" justifyItems=\\"space-between\\" as=\\"span\\" inline={false} visualDebug={false} wrapItems={false}>
|
||||
<FlexItem grow={true} shrink={true} as=\\"span\\">
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
maxWidth="30rem"
|
||||
padding="small"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
<Flex
|
||||
alignItems="stretch"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="space-between"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={true}
|
||||
shrink={true}
|
||||
>
|
||||
<div>
|
||||
Last Assessment:
|
||||
No submissions
|
||||
</div>
|
||||
</FlexItem>
|
||||
<FlexItem grow={true} shrink={true} align=\\"stretch\\" as=\\"span\\">
|
||||
<Text size=\\"small\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<FlexItem
|
||||
align="stretch"
|
||||
as="span"
|
||||
grow={true}
|
||||
shrink={true}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
<div>
|
||||
<div style={{...}}>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"color": "#green",
|
||||
"textAlign": "end",
|
||||
}
|
||||
}
|
||||
>
|
||||
I am Groot
|
||||
</div>
|
||||
</div>
|
||||
</Text>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
<hr role=\\"presentation\\" />
|
||||
<hr
|
||||
role="presentation"
|
||||
/>
|
||||
<div>
|
||||
<Text size=\\"small\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
Calculation Method
|
||||
</Text>
|
||||
<div>
|
||||
Highest Score
|
||||
</div>
|
||||
<div style={{...}}>
|
||||
<Text size=\\"small\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"padding": "0.5rem 0 0 0",
|
||||
}
|
||||
}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
Example
|
||||
</Text>
|
||||
</div>
|
||||
|
|
@ -128,55 +355,172 @@ exports[`renders correctly with no results 1`] = `
|
|||
</View>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
<FlexItem as=\\"span\\" grow={false} shrink={false} />
|
||||
</span>"
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
/>
|
||||
</span>
|
||||
`;
|
||||
|
||||
exports[`renders the OutcomePopover component 1`] = `
|
||||
"<span>
|
||||
<Popover placement=\\"bottom\\" onToggle={[Function: onToggle]} onClick={[Function: onClick]} onFocus={[Function: onFocus]} onBlur={[Function: onBlur]} onMouseOver={[Function: onMouseOver]} onMouseOut={[Function: onMouseOut]} onShow={[Function: onShow]} onDismiss={[Function: onDismiss]} stacking=\\"topmost\\" offsetX={0} offsetY={0} variant=\\"default\\" on={{...}} contentRef={[Function: contentRef]} defaultShow={false} withArrow={true} trackPosition={true} constrain=\\"window\\" onPositioned={[Function: onPositioned]} onPositionChanged={[Function: onPositionChanged]} shouldRenderOffscreen={false} shouldContainFocus={false} shouldReturnFocus={true} shouldCloseOnDocumentClick={true} shouldCloseOnEscape={true} defaultFocusElement={{...}} label={{...}} mountNode={{...}} insertAt=\\"bottom\\" liveRegion={{...}} positionTarget={{...}} alignArrow={false}>
|
||||
<span>
|
||||
<Popover
|
||||
alignArrow={false}
|
||||
constrain="window"
|
||||
contentRef={[Function]}
|
||||
defaultFocusElement={null}
|
||||
defaultShow={false}
|
||||
insertAt="bottom"
|
||||
label={null}
|
||||
liveRegion={null}
|
||||
mountNode={null}
|
||||
offsetX={0}
|
||||
offsetY={0}
|
||||
on={
|
||||
Array [
|
||||
"hover",
|
||||
"focus",
|
||||
]
|
||||
}
|
||||
onBlur={[Function]}
|
||||
onClick={[Function]}
|
||||
onDismiss={[Function]}
|
||||
onFocus={[Function]}
|
||||
onMouseOut={[Function]}
|
||||
onMouseOver={[Function]}
|
||||
onPositionChanged={[Function]}
|
||||
onPositioned={[Function]}
|
||||
onShow={[Function]}
|
||||
onToggle={[Function]}
|
||||
placement="bottom"
|
||||
positionTarget={null}
|
||||
shouldCloseOnDocumentClick={true}
|
||||
shouldCloseOnEscape={true}
|
||||
shouldContainFocus={false}
|
||||
shouldRenderOffscreen={false}
|
||||
shouldReturnFocus={true}
|
||||
stacking="topmost"
|
||||
trackPosition={true}
|
||||
variant="default"
|
||||
withArrow={true}
|
||||
>
|
||||
<PopoverTrigger>
|
||||
<Link onClick={[Function: onClick]} variant=\\"default\\" as=\\"button\\" linkRef={[Function: linkRef]} ellipsis={false} iconPlacement=\\"start\\">
|
||||
<span style={{...}}>
|
||||
<Link
|
||||
as="button"
|
||||
ellipsis={false}
|
||||
iconPlacement="start"
|
||||
linkRef={[Function]}
|
||||
onClick={[Function]}
|
||||
variant="default"
|
||||
>
|
||||
<span
|
||||
style={
|
||||
Object {
|
||||
"color": "black",
|
||||
}
|
||||
}
|
||||
>
|
||||
<IconInfo />
|
||||
</span>
|
||||
<span>
|
||||
<ScreenReaderContent as=\\"span\\">
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
Click to expand outcome details
|
||||
</ScreenReaderContent>
|
||||
</span>
|
||||
</Link>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent>
|
||||
<View as=\\"div\\" padding=\\"small\\" maxWidth=\\"30rem\\" display=\\"auto\\">
|
||||
<Text size=\\"small\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<Flex alignItems=\\"stretch\\" direction=\\"row\\" justifyItems=\\"space-between\\" as=\\"span\\" inline={false} visualDebug={false} wrapItems={false}>
|
||||
<FlexItem grow={true} shrink={true} as=\\"span\\">
|
||||
<View
|
||||
as="div"
|
||||
display="auto"
|
||||
maxWidth="30rem"
|
||||
padding="small"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
>
|
||||
<Flex
|
||||
alignItems="stretch"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="space-between"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={true}
|
||||
shrink={true}
|
||||
>
|
||||
<div>
|
||||
Last Assessment:
|
||||
<DatetimeDisplay datetime={{...}} format=\\"%b %d, %l:%M %p\\" />
|
||||
<DatetimeDisplay
|
||||
datetime={2018-02-01T07:01:00.000Z}
|
||||
format="%b %d, %l:%M %p"
|
||||
/>
|
||||
</div>
|
||||
</FlexItem>
|
||||
<FlexItem grow={true} shrink={true} align=\\"stretch\\" as=\\"span\\">
|
||||
<Text size=\\"small\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<FlexItem
|
||||
align="stretch"
|
||||
as="span"
|
||||
grow={true}
|
||||
shrink={true}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
<div>
|
||||
<div style={{...}}>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"color": "#green",
|
||||
"textAlign": "end",
|
||||
}
|
||||
}
|
||||
>
|
||||
I am Groot
|
||||
</div>
|
||||
</div>
|
||||
</Text>
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
<hr role=\\"presentation\\" />
|
||||
<hr
|
||||
role="presentation"
|
||||
/>
|
||||
<div>
|
||||
<Text size=\\"small\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
Calculation Method
|
||||
</Text>
|
||||
<div>
|
||||
Highest Score
|
||||
</div>
|
||||
<div style={{...}}>
|
||||
<Text size=\\"small\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"padding": "0.5rem 0 0 0",
|
||||
}
|
||||
}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
Example
|
||||
</Text>
|
||||
</div>
|
||||
|
|
@ -194,6 +538,10 @@ exports[`renders the OutcomePopover component 1`] = `
|
|||
</View>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
<FlexItem as=\\"span\\" grow={false} shrink={false} />
|
||||
</span>"
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
/>
|
||||
</span>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -1,18 +1,66 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`properly renders the UnassessedAssignment component 1`] = `
|
||||
"<ListItem>
|
||||
<View padding=\\"small\\" display=\\"auto\\">
|
||||
<ApplyTheme theme={{...}} immutable={false}>
|
||||
<Link href=\\"www.example.com\\" variant=\\"default\\" as=\\"button\\" linkRef={[Function: linkRef]} ellipsis={false} iconPlacement=\\"start\\">
|
||||
<Flex alignItems=\\"center\\" as=\\"span\\" direction=\\"row\\" justifyItems=\\"start\\" inline={false} visualDebug={false} wrapItems={false}>
|
||||
<FlexItem padding=\\"0 0 0 small\\" as=\\"span\\" grow={false} shrink={false}>
|
||||
<Text size=\\"medium\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<ListItem
|
||||
key="1"
|
||||
>
|
||||
<View
|
||||
display="auto"
|
||||
padding="small"
|
||||
>
|
||||
<ApplyTheme
|
||||
immutable={false}
|
||||
theme={
|
||||
Object {
|
||||
Symbol(Link): Object {
|
||||
"color": "#68777D",
|
||||
},
|
||||
}
|
||||
}
|
||||
>
|
||||
<Link
|
||||
as="button"
|
||||
ellipsis={false}
|
||||
href="www.example.com"
|
||||
iconPlacement="start"
|
||||
linkRef={[Function]}
|
||||
variant="default"
|
||||
>
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="start"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
padding="0 0 0 small"
|
||||
shrink={false}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="medium"
|
||||
>
|
||||
<IconAssignment />
|
||||
</Text>
|
||||
</FlexItem>
|
||||
<FlexItem padding=\\"0 x-small\\" as=\\"span\\" grow={false} shrink={false}>
|
||||
<Text weight=\\"bold\\" as=\\"span\\" size=\\"medium\\" letterSpacing=\\"normal\\">
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
padding="0 x-small"
|
||||
shrink={false}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="medium"
|
||||
weight="bold"
|
||||
>
|
||||
example
|
||||
(
|
||||
Not yet assessed
|
||||
|
|
@ -23,5 +71,5 @@ exports[`properly renders the UnassessedAssignment component 1`] = `
|
|||
</Link>
|
||||
</ApplyTheme>
|
||||
</View>
|
||||
</ListItem>"
|
||||
</ListItem>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -1,9 +1,27 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`renders the component 1`] = `
|
||||
"<Flex justifyItems=\\"center\\" alignItems=\\"center\\" padding=\\"medium\\" as=\\"span\\" direction=\\"row\\" inline={false} visualDebug={false} wrapItems={false}>
|
||||
<FlexItem as=\\"span\\" grow={false} shrink={false}>
|
||||
<Spinner size=\\"large\\" title=\\"Loading outcome results\\" as=\\"div\\" variant=\\"default\\" />
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="center"
|
||||
padding="medium"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
<Spinner
|
||||
as="div"
|
||||
size="large"
|
||||
title="Loading outcome results"
|
||||
variant="default"
|
||||
/>
|
||||
</FlexItem>
|
||||
</Flex>"
|
||||
</Flex>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -36,7 +36,7 @@ const props = {
|
|||
|
||||
it('renders the component', () => {
|
||||
const wrapper = shallow(<IndividualStudentMastery {...props}/>)
|
||||
expect(wrapper.debug()).toMatchSnapshot()
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('attempts to load when mounted', () => {
|
||||
|
|
|
|||
|
|
@ -33,8 +33,8 @@ describe('The CommentButton component', () => {
|
|||
const component = (mods) => shallow(<CommentButton {...{ ...props, ...mods }} />)
|
||||
|
||||
it('renders the root component as expected', () => {
|
||||
expect(component().debug()).toMatchSnapshot()
|
||||
expect(component().find('CommentDialog').shallow().debug()).toMatchSnapshot()
|
||||
expect(component()).toMatchSnapshot()
|
||||
expect(component().find('CommentDialog').shallow()).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('opens the dialog when the outer button is clicked', () => {
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@ describe('The Comments component', () => {
|
|||
const rating = (mods) => component(mods).find('CommentText').shallow()
|
||||
|
||||
it('renders the root component as expected when assessing', () => {
|
||||
expect(component().debug()).toMatchSnapshot()
|
||||
expect(component()).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('directly renders comments_html', () => {
|
||||
|
|
@ -49,7 +49,7 @@ describe('The Comments component', () => {
|
|||
})
|
||||
|
||||
it('renders a placeholder when no assessment provided', () => {
|
||||
expect(rating({ assessing: false, assessment: null }).debug()).toMatchSnapshot()
|
||||
expect(rating({ assessing: false, assessment: null })).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('shows no selector when no comments are presented', () => {
|
||||
|
|
@ -89,6 +89,6 @@ describe('The Comments component', () => {
|
|||
it('renders a footer after the comment when provided', () => {
|
||||
const el = component({ assessing: false, footer: <div>this is a footer</div> })
|
||||
|
||||
expect(el.shallow().debug()).toMatchSnapshot()
|
||||
expect(el.shallow()).toMatchSnapshot()
|
||||
})
|
||||
})
|
||||
|
|
|
|||
|
|
@ -41,13 +41,13 @@ _.toPairs(rubrics).forEach(([key, rubric]) => {
|
|||
const component = (mods) => shallow(<Criterion {...{ ...props, ...mods }} />)
|
||||
|
||||
it('renders the root component as expected', () => {
|
||||
expect(component().debug()).toMatchSnapshot()
|
||||
expect(component()).toMatchSnapshot()
|
||||
})
|
||||
|
||||
subComponents.forEach((name) => {
|
||||
it(`renders the ${name} sub-component(s) as expected`, () => {
|
||||
component().find(name)
|
||||
.forEach((el) => expect(el.shallow().debug()).toMatchSnapshot())
|
||||
.forEach((el) => expect(el.shallow()).toMatchSnapshot())
|
||||
})
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ describe('The Points component', () => {
|
|||
expect(component({
|
||||
assessment: { ...id, points: validPoints('1') },
|
||||
pointsPossible: 2
|
||||
}).debug()).toMatchSnapshot()
|
||||
})).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('renders the component when assessing with the expected layout', () => {
|
||||
|
|
@ -37,7 +37,7 @@ describe('The Points component', () => {
|
|||
assessment: { ...id, points: validPoints('1') },
|
||||
assessing: true,
|
||||
pointsPossible: 2
|
||||
}).debug()).toMatchSnapshot()
|
||||
})).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('renders the right text for fractional points', () => {
|
||||
|
|
|
|||
|
|
@ -37,7 +37,7 @@ const defaultProps = (props = {}) => (
|
|||
|
||||
it('renders the ProficiencyRating component', () => {
|
||||
const wrapper = shallow(<ProficiencyRating {...defaultProps()}/>)
|
||||
expect(wrapper.debug()).toMatchSnapshot()
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('mastery checkbox is checked if mastery', () => {
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@ describe('default proficiency', () => {
|
|||
|
||||
it('renders the ProficiencyRating component', () => {
|
||||
const wrapper = shallow(<ProficiencyTable {...defaultProps} />)
|
||||
expect(wrapper.debug()).toMatchSnapshot()
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('renders loading at startup', () => {
|
||||
|
|
|
|||
|
|
@ -42,13 +42,13 @@ describe('The Ratings component', () => {
|
|||
|
||||
const component = (mods) => shallow(<Ratings {...{ ...props, ...mods }} />)
|
||||
it('renders the root component as expected', () => {
|
||||
expect(component().debug()).toMatchSnapshot()
|
||||
expect(component()).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('renders the Rating sub-components as expected when range rating enabled', () => {
|
||||
const useRange = true
|
||||
component({ useRange }).find('Rating')
|
||||
.forEach((el) => expect(el.shallow().debug()).toMatchSnapshot())
|
||||
.forEach((el) => expect(el.shallow()).toMatchSnapshot())
|
||||
})
|
||||
|
||||
it('properly selects ratings when two tiers have the same point value', () => {
|
||||
|
|
@ -174,7 +174,7 @@ describe('The Ratings component', () => {
|
|||
expect(ratings).toHaveLength(1)
|
||||
|
||||
const rating = ratings.at(0)
|
||||
expect(rating.shallow().debug()).toMatchSnapshot()
|
||||
expect(rating.shallow()).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('renders a default rating if none of the ratings are selected', () => {
|
||||
|
|
@ -184,7 +184,7 @@ describe('The Ratings component', () => {
|
|||
expect(ratings).toHaveLength(1)
|
||||
|
||||
const rating = ratings.at(0)
|
||||
expect(rating.shallow().debug()).toMatchSnapshot()
|
||||
expect(rating.shallow()).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('hides points on the default rating if points are hidden', () => {
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@ describe('the Rubric component', () => {
|
|||
rubricAssociation={assessments.points.rubric_association}
|
||||
/>
|
||||
)
|
||||
expect(modal.debug()).toMatchSnapshot()
|
||||
expect(modal).toMatchSnapshot()
|
||||
expect(modal.find('.react-rubric').prop('style')).toEqual({ minWidth: '52.5rem' })
|
||||
})
|
||||
|
||||
|
|
@ -42,7 +42,7 @@ describe('the Rubric component', () => {
|
|||
rubricAssociation={assessments.points.rubric_association}
|
||||
/>
|
||||
)
|
||||
expect(modal.debug()).toMatchSnapshot()
|
||||
expect(modal).toMatchSnapshot()
|
||||
})
|
||||
|
||||
const setCloned = (object, path, value) => _.setWith(_.clone(object), path, value, _.clone)
|
||||
|
|
@ -54,7 +54,7 @@ describe('the Rubric component', () => {
|
|||
rubricAssessment={hidden}
|
||||
rubricAssociation={hidden.rubric_association}
|
||||
/>)
|
||||
expect(modal.debug()).toMatchSnapshot()
|
||||
expect(modal).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('updates the total score when an individual criterion point assessment changes', () => {
|
||||
|
|
@ -81,7 +81,7 @@ describe('the Rubric component', () => {
|
|||
}]
|
||||
])
|
||||
|
||||
expect(renderAssessing(onAssessmentChange.args[0][0]).debug()).toMatchSnapshot()
|
||||
expect(renderAssessing(onAssessmentChange.args[0][0])).toMatchSnapshot()
|
||||
})
|
||||
|
||||
describe('points column', () => {
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@ const defaultProps = (props = {}) => (
|
|||
|
||||
it('renders the RubricManagement component', () => {
|
||||
const wrapper = shallow(<RubricManagement {...defaultProps()}/>)
|
||||
expect(wrapper.debug()).toMatchSnapshot()
|
||||
expect(wrapper).toMatchSnapshot()
|
||||
})
|
||||
|
||||
it('passes accountId to the ProficiencyTable component', () => {
|
||||
|
|
|
|||
|
|
@ -1,40 +1,137 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`The CommentButton component renders the root component as expected 1`] = `
|
||||
"<div>
|
||||
<Button variant=\\"icon\\" icon={{...}} margin=\\"0 x-small 0 0\\" onClick={[Function: onClick]} as=\\"button\\" type=\\"button\\" size=\\"medium\\" fluidWidth={false} buttonRef={[Function: buttonRef]} cursor=\\"pointer\\">
|
||||
<ScreenReaderContent as=\\"span\\">
|
||||
<div>
|
||||
<Button
|
||||
as="button"
|
||||
buttonRef={[Function]}
|
||||
cursor="pointer"
|
||||
fluidWidth={false}
|
||||
icon={<IconFeedback />}
|
||||
margin="0 x-small 0 0"
|
||||
onClick={[Function]}
|
||||
size="medium"
|
||||
type="button"
|
||||
variant="icon"
|
||||
>
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
Additional Comments
|
||||
</ScreenReaderContent>
|
||||
</Button>
|
||||
<CommentDialog description=\\"Criterion description\\" open={false} comments=\\"some things\\" finalize={[Function: proxy]} setComments={[Function: proxy]} />
|
||||
</div>"
|
||||
<CommentDialog
|
||||
comments="some things"
|
||||
description="Criterion description"
|
||||
finalize={[Function]}
|
||||
open={false}
|
||||
setComments={[Function]}
|
||||
/>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`The CommentButton component renders the root component as expected 2`] = `
|
||||
"<Modal open={false} onDismiss={[Function: close]} size=\\"medium\\" label=\\"Additional Comments\\" defaultFocusElement={[Function: defaultFocusElement]} shouldCloseOnDocumentClick={true} transition=\\"fade\\" onOpen={[Function: onOpen]} onClose={[Function: onClose]} onEnter={[Function: onEnter]} onEntering={[Function: onEntering]} onEntered={[Function: onEntered]} onExit={[Function: onExit]} onExiting={[Function: onExiting]} onExited={[Function: onExited]} mountNode={{...}} insertAt=\\"bottom\\" liveRegion={{...}} contentRef={[Function: contentRef]} shouldReturnFocus={true} constrain=\\"window\\">
|
||||
<Modal
|
||||
constrain="window"
|
||||
contentRef={[Function]}
|
||||
defaultFocusElement={[Function]}
|
||||
insertAt="bottom"
|
||||
label="Additional Comments"
|
||||
liveRegion={null}
|
||||
mountNode={null}
|
||||
onClose={[Function]}
|
||||
onDismiss={[Function]}
|
||||
onEnter={[Function]}
|
||||
onEntered={[Function]}
|
||||
onEntering={[Function]}
|
||||
onExit={[Function]}
|
||||
onExited={[Function]}
|
||||
onExiting={[Function]}
|
||||
onOpen={[Function]}
|
||||
open={false}
|
||||
shouldCloseOnDocumentClick={true}
|
||||
shouldReturnFocus={true}
|
||||
size="medium"
|
||||
transition="fade"
|
||||
>
|
||||
<ModalHeader>
|
||||
<CloseButton placement=\\"end\\" offset=\\"medium\\" variant=\\"icon\\" onClick={[Function: close]} buttonRef={[Function: buttonRef]} size=\\"small\\" margin=\\"0\\">
|
||||
<CloseButton
|
||||
buttonRef={[Function]}
|
||||
margin="0"
|
||||
offset="medium"
|
||||
onClick={[Function]}
|
||||
placement="end"
|
||||
size="small"
|
||||
variant="icon"
|
||||
>
|
||||
Close
|
||||
</CloseButton>
|
||||
<Heading border=\\"none\\" color=\\"inherit\\" level=\\"h2\\" ellipsis={false}>
|
||||
<Heading
|
||||
border="none"
|
||||
color="inherit"
|
||||
ellipsis={false}
|
||||
level="h2"
|
||||
>
|
||||
Additional Comments
|
||||
</Heading>
|
||||
<Heading level=\\"h3\\" border=\\"none\\" color=\\"inherit\\" ellipsis={false}>
|
||||
<Heading
|
||||
border="none"
|
||||
color="inherit"
|
||||
ellipsis={false}
|
||||
level="h3"
|
||||
>
|
||||
Criterion description
|
||||
</Heading>
|
||||
</ModalHeader>
|
||||
<ModalBody padding=\\"medium\\" as=\\"div\\">
|
||||
<TextArea data-selenium=\\"criterion_comments_text\\" label=\\"Comments\\" maxHeight=\\"50rem\\" onChange={[Function: onChange]} value=\\"some things\\" size=\\"medium\\" autoGrow={true} resize=\\"none\\" inline={false} messages={{...}} disabled={false} readOnly={false} textareaRef={[Function: textareaRef]} layout=\\"stacked\\" />
|
||||
<ModalBody
|
||||
as="div"
|
||||
padding="medium"
|
||||
>
|
||||
<TextArea
|
||||
autoGrow={true}
|
||||
data-selenium="criterion_comments_text"
|
||||
disabled={false}
|
||||
inline={false}
|
||||
label="Comments"
|
||||
layout="stacked"
|
||||
maxHeight="50rem"
|
||||
messages={Array []}
|
||||
onChange={[Function]}
|
||||
readOnly={false}
|
||||
resize="none"
|
||||
size="medium"
|
||||
textareaRef={[Function]}
|
||||
value="some things"
|
||||
/>
|
||||
</ModalBody>
|
||||
<ModalFooter>
|
||||
<Button variant=\\"light\\" margin=\\"0 x-small 0 0\\" onClick={[Function: close]} as=\\"button\\" type=\\"button\\" size=\\"medium\\" fluidWidth={false} buttonRef={[Function: buttonRef]} cursor=\\"pointer\\">
|
||||
<Button
|
||||
as="button"
|
||||
buttonRef={[Function]}
|
||||
cursor="pointer"
|
||||
fluidWidth={false}
|
||||
margin="0 x-small 0 0"
|
||||
onClick={[Function]}
|
||||
size="medium"
|
||||
type="button"
|
||||
variant="light"
|
||||
>
|
||||
Cancel
|
||||
</Button>
|
||||
|
||||
<Button variant=\\"primary\\" margin=\\"0 x-small 0 0\\" onClick={[Function: onClick]} as=\\"button\\" type=\\"button\\" size=\\"medium\\" fluidWidth={false} buttonRef={[Function: buttonRef]} cursor=\\"pointer\\">
|
||||
<Button
|
||||
as="button"
|
||||
buttonRef={[Function]}
|
||||
cursor="pointer"
|
||||
fluidWidth={false}
|
||||
margin="0 x-small 0 0"
|
||||
onClick={[Function]}
|
||||
size="medium"
|
||||
type="button"
|
||||
variant="primary"
|
||||
>
|
||||
Update Comment
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
</Modal>"
|
||||
</Modal>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -3,20 +3,61 @@
|
|||
exports[`The Comments component directly renders comments_html 1`] = `"<div>I award you <b>no</b> points, and may God have mercy on your soul.</div>"`;
|
||||
|
||||
exports[`The Comments component renders a footer after the comment when provided 1`] = `
|
||||
"<div className=\\"rubric-freeform\\">
|
||||
<CommentText assessment={{...}} placeholder=\\"This area will be used by the assessor to leave comments related to this criterion.\\" weight=\\"normal\\" />
|
||||
<div
|
||||
className="rubric-freeform"
|
||||
>
|
||||
<CommentText
|
||||
assessment={
|
||||
Object {
|
||||
"above_threshold": false,
|
||||
"comments": "I award you no points, and may God have mercy on your soul.",
|
||||
"comments_enabled": true,
|
||||
"comments_html": "I award you <b>no</b> points, and may God have mercy on your soul.",
|
||||
"criterion_id": "7_391",
|
||||
"description": "No details",
|
||||
"learning_outcome_id": "612",
|
||||
"points": Object {
|
||||
"text": null,
|
||||
"valid": true,
|
||||
"value": 0,
|
||||
},
|
||||
}
|
||||
}
|
||||
placeholder="This area will be used by the assessor to leave comments related to this criterion."
|
||||
weight="normal"
|
||||
/>
|
||||
<div>
|
||||
this is a footer
|
||||
</div>
|
||||
</div>"
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`The Comments component renders a placeholder when no assessment provided 1`] = `
|
||||
"<span className=\\"react-rubric-break-words\\">
|
||||
<Text size=\\"x-small\\" weight=\\"normal\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<span
|
||||
className="react-rubric-break-words"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="x-small"
|
||||
weight="normal"
|
||||
>
|
||||
This area will be used by the assessor to leave comments related to this criterion.
|
||||
</Text>
|
||||
</span>"
|
||||
</span>
|
||||
`;
|
||||
|
||||
exports[`The Comments component renders the root component as expected when assessing 1`] = `"<FreeFormComments comments=\\"I award you no points, and may God have mercy on your soul.\\" saveLater={false} savedComments={{...}} setComments={[Function: proxy]} setSaveLater={[Function: proxy]} />"`;
|
||||
exports[`The Comments component renders the root component as expected when assessing 1`] = `
|
||||
<FreeFormComments
|
||||
comments="I award you no points, and may God have mercy on your soul."
|
||||
saveLater={false}
|
||||
savedComments={
|
||||
Array [
|
||||
"I award you no points",
|
||||
"May god have mercy on your soul",
|
||||
]
|
||||
}
|
||||
setComments={[Function]}
|
||||
setSaveLater={[Function]}
|
||||
/>
|
||||
`;
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,20 +1,63 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`The Points component renders the component when assessing with the expected layout 1`] = `
|
||||
"<div className=\\"react-rubric-cell graded-points\\">
|
||||
<Flex alignItems=\\"end\\" wrapItems={true} as=\\"span\\" direction=\\"row\\" justifyItems=\\"start\\" inline={false} visualDebug={false}>
|
||||
<FlexItem size=\\"4rem\\" margin=\\"none small none none\\" as=\\"span\\" grow={false} shrink={false}>
|
||||
<TextInput inline={true} label={{...}} messages={{...}} onChange={[Function: onChange]} value=\\"1\\" width=\\"4rem\\" type=\\"text\\" size=\\"medium\\" textAlign=\\"start\\" disabled={false} readOnly={false} inputRef={[Function: inputRef]} layout=\\"stacked\\" />
|
||||
<div
|
||||
className="react-rubric-cell graded-points"
|
||||
>
|
||||
<Flex
|
||||
alignItems="end"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="start"
|
||||
visualDebug={false}
|
||||
wrapItems={true}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
margin="none small none none"
|
||||
shrink={false}
|
||||
size="4rem"
|
||||
>
|
||||
<TextInput
|
||||
disabled={false}
|
||||
inline={true}
|
||||
inputRef={[Function]}
|
||||
label={
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
Points
|
||||
</ScreenReaderContent>
|
||||
}
|
||||
layout="stacked"
|
||||
messages={Array []}
|
||||
onChange={[Function]}
|
||||
readOnly={false}
|
||||
size="medium"
|
||||
textAlign="start"
|
||||
type="text"
|
||||
value="1"
|
||||
width="4rem"
|
||||
/>
|
||||
</FlexItem>
|
||||
<FlexItem margin=\\"small none none none\\" as=\\"span\\" grow={false} shrink={false}>
|
||||
<FlexItem
|
||||
as="span"
|
||||
grow={false}
|
||||
margin="small none none none"
|
||||
shrink={false}
|
||||
>
|
||||
/ 2 pts
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
</div>"
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`The Points component renders the root component as expected 1`] = `
|
||||
"<div className=\\"react-rubric-cell graded-points\\">
|
||||
<div
|
||||
className="react-rubric-cell graded-points"
|
||||
>
|
||||
1 / 2 pts
|
||||
</div>"
|
||||
</div>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -1,39 +1,277 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`renders the ProficiencyRating component 1`] = `
|
||||
"<tr>
|
||||
<td style={{...}}>
|
||||
<div style={{...}}>
|
||||
<RadioInput label={{...}} checked={false} onChange={[Function]} onClick={[Function: onClick]} variant=\\"simple\\" size=\\"medium\\" disabled={false} inline={false} context=\\"success\\" readOnly={false} />
|
||||
<tr>
|
||||
<td
|
||||
style={
|
||||
Object {
|
||||
"padding": "1.1rem 0 0 0",
|
||||
"textAlign": "center",
|
||||
"verticalAlign": "top",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"display": "inline-block",
|
||||
}
|
||||
}
|
||||
>
|
||||
<RadioInput
|
||||
checked={false}
|
||||
context="success"
|
||||
disabled={false}
|
||||
inline={false}
|
||||
label={
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
Change mastery
|
||||
</ScreenReaderContent>
|
||||
}
|
||||
onChange={[Function]}
|
||||
onClick={[Function]}
|
||||
readOnly={false}
|
||||
size="medium"
|
||||
variant="simple"
|
||||
/>
|
||||
</div>
|
||||
</td>
|
||||
<td className=\\"description\\" style={{...}}>
|
||||
<TextInput label={{...}} messages={{...}} onChange={[Function]} defaultValue=\\"Stellar\\" inline={false} type=\\"text\\" size=\\"medium\\" textAlign=\\"start\\" disabled={false} readOnly={false} inputRef={[Function: inputRef]} layout=\\"stacked\\" />
|
||||
<td
|
||||
className="description"
|
||||
style={
|
||||
Object {
|
||||
"verticalAlign": "top",
|
||||
}
|
||||
}
|
||||
>
|
||||
<TextInput
|
||||
defaultValue="Stellar"
|
||||
disabled={false}
|
||||
inline={false}
|
||||
inputRef={[Function]}
|
||||
label={
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
Change description
|
||||
</ScreenReaderContent>
|
||||
}
|
||||
layout="stacked"
|
||||
messages={null}
|
||||
onChange={[Function]}
|
||||
readOnly={false}
|
||||
size="medium"
|
||||
textAlign="start"
|
||||
type="text"
|
||||
/>
|
||||
</td>
|
||||
<td className=\\"points\\" style={{...}}>
|
||||
<TextInput label={{...}} messages={{...}} onChange={[Function]} defaultValue=\\"10\\" width=\\"4rem\\" inline={false} type=\\"text\\" size=\\"medium\\" textAlign=\\"start\\" disabled={false} readOnly={false} inputRef={[Function: inputRef]} layout=\\"stacked\\" />
|
||||
<td
|
||||
className="points"
|
||||
style={
|
||||
Object {
|
||||
"verticalAlign": "top",
|
||||
}
|
||||
}
|
||||
>
|
||||
<TextInput
|
||||
defaultValue="10"
|
||||
disabled={false}
|
||||
inline={false}
|
||||
inputRef={[Function]}
|
||||
label={
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
Change points
|
||||
</ScreenReaderContent>
|
||||
}
|
||||
layout="stacked"
|
||||
messages={null}
|
||||
onChange={[Function]}
|
||||
readOnly={false}
|
||||
size="medium"
|
||||
textAlign="start"
|
||||
type="text"
|
||||
width="4rem"
|
||||
/>
|
||||
</td>
|
||||
<td className=\\"color\\" style={{...}}>
|
||||
<Popover on=\\"click\\" show={false} onToggle={[Function]} onClick={[Function: onClick]} onFocus={[Function: onFocus]} onBlur={[Function: onBlur]} onMouseOver={[Function: onMouseOver]} onMouseOut={[Function: onMouseOut]} onShow={[Function: onShow]} onDismiss={[Function: onDismiss]} placement=\\"bottom center\\" stacking=\\"topmost\\" offsetX={0} offsetY={0} variant=\\"default\\" contentRef={[Function: contentRef]} defaultShow={false} withArrow={true} trackPosition={true} constrain=\\"window\\" onPositioned={[Function: onPositioned]} onPositionChanged={[Function: onPositionChanged]} shouldRenderOffscreen={false} shouldContainFocus={false} shouldReturnFocus={true} shouldCloseOnDocumentClick={true} shouldCloseOnEscape={true} defaultFocusElement={{...}} label={{...}} mountNode={{...}} insertAt=\\"bottom\\" liveRegion={{...}} positionTarget={{...}} alignArrow={false}>
|
||||
<td
|
||||
className="color"
|
||||
style={
|
||||
Object {
|
||||
"verticalAlign": "top",
|
||||
}
|
||||
}
|
||||
>
|
||||
<Popover
|
||||
alignArrow={false}
|
||||
constrain="window"
|
||||
contentRef={[Function]}
|
||||
defaultFocusElement={null}
|
||||
defaultShow={false}
|
||||
insertAt="bottom"
|
||||
label={null}
|
||||
liveRegion={null}
|
||||
mountNode={null}
|
||||
offsetX={0}
|
||||
offsetY={0}
|
||||
on="click"
|
||||
onBlur={[Function]}
|
||||
onClick={[Function]}
|
||||
onDismiss={[Function]}
|
||||
onFocus={[Function]}
|
||||
onMouseOut={[Function]}
|
||||
onMouseOver={[Function]}
|
||||
onPositionChanged={[Function]}
|
||||
onPositioned={[Function]}
|
||||
onShow={[Function]}
|
||||
onToggle={[Function]}
|
||||
placement="bottom center"
|
||||
positionTarget={null}
|
||||
shouldCloseOnDocumentClick={true}
|
||||
shouldCloseOnEscape={true}
|
||||
shouldContainFocus={false}
|
||||
shouldRenderOffscreen={false}
|
||||
shouldReturnFocus={true}
|
||||
show={false}
|
||||
stacking="topmost"
|
||||
trackPosition={true}
|
||||
variant="default"
|
||||
withArrow={true}
|
||||
>
|
||||
<PopoverTrigger>
|
||||
<Button variant=\\"link\\" as=\\"button\\" type=\\"button\\" size=\\"medium\\" margin=\\"0\\" fluidWidth={false} buttonRef={[Function: buttonRef]} cursor=\\"pointer\\">
|
||||
<Button
|
||||
as="button"
|
||||
buttonRef={[Function]}
|
||||
cursor="pointer"
|
||||
fluidWidth={false}
|
||||
margin="0"
|
||||
size="medium"
|
||||
type="button"
|
||||
variant="link"
|
||||
>
|
||||
<div>
|
||||
<span className=\\"colorPickerIcon\\" style={{...}} />
|
||||
<span
|
||||
className="colorPickerIcon"
|
||||
style={
|
||||
Object {
|
||||
"background": "#00ff00",
|
||||
}
|
||||
}
|
||||
/>
|
||||
Change
|
||||
</div>
|
||||
</Button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent>
|
||||
<ColorPicker parentComponent=\\"ProficiencyRating\\" colors={{...}} currentColor=\\"#00ff00\\" isOpen={true} hidePrompt={true} nonModal={true} hideOnScroll={false} withAnimation={false} withBorder={false} withBoxShadow={false} withArrow={false} focusOnMount={false} afterClose={[Function]} setStatusColor={[Function]} withDarkCheck={false} allowWhite={false} />
|
||||
<ColorPicker
|
||||
afterClose={[Function]}
|
||||
allowWhite={false}
|
||||
colors={
|
||||
Array [
|
||||
Object {
|
||||
"hexcode": "#BD3C14",
|
||||
"name": "Brick",
|
||||
},
|
||||
Object {
|
||||
"hexcode": "#FF2717",
|
||||
"name": "Red",
|
||||
},
|
||||
Object {
|
||||
"hexcode": "#E71F63",
|
||||
"name": "Magenta",
|
||||
},
|
||||
Object {
|
||||
"hexcode": "#8F3E97",
|
||||
"name": "Purple",
|
||||
},
|
||||
Object {
|
||||
"hexcode": "#65499D",
|
||||
"name": "Deep Purple",
|
||||
},
|
||||
Object {
|
||||
"hexcode": "#4554A4",
|
||||
"name": "Indigo",
|
||||
},
|
||||
Object {
|
||||
"hexcode": "#1770AB",
|
||||
"name": "Blue",
|
||||
},
|
||||
Object {
|
||||
"hexcode": "#0B9BE3",
|
||||
"name": "Light Blue",
|
||||
},
|
||||
Object {
|
||||
"hexcode": "#06A3B7",
|
||||
"name": "Cyan",
|
||||
},
|
||||
Object {
|
||||
"hexcode": "#009688",
|
||||
"name": "Teal",
|
||||
},
|
||||
Object {
|
||||
"hexcode": "#009606",
|
||||
"name": "Green",
|
||||
},
|
||||
Object {
|
||||
"hexcode": "#8D9900",
|
||||
"name": "Olive",
|
||||
},
|
||||
Object {
|
||||
"hexcode": "#D97900",
|
||||
"name": "Pumpkin",
|
||||
},
|
||||
Object {
|
||||
"hexcode": "#FD5D10",
|
||||
"name": "Orange",
|
||||
},
|
||||
Object {
|
||||
"hexcode": "#F06291",
|
||||
"name": "Pink",
|
||||
},
|
||||
]
|
||||
}
|
||||
currentColor="#00ff00"
|
||||
focusOnMount={false}
|
||||
hideOnScroll={false}
|
||||
hidePrompt={true}
|
||||
isOpen={true}
|
||||
nonModal={true}
|
||||
parentComponent="ProficiencyRating"
|
||||
setStatusColor={[Function]}
|
||||
withAnimation={false}
|
||||
withArrow={false}
|
||||
withBorder={false}
|
||||
withBoxShadow={false}
|
||||
withDarkCheck={false}
|
||||
/>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
<div className=\\"delete\\">
|
||||
<Button disabled={false} buttonRef={[Function]} onClick={[Function]} variant=\\"icon\\" icon={{...}} as=\\"button\\" type=\\"button\\" size=\\"medium\\" margin=\\"0\\" fluidWidth={false} cursor=\\"pointer\\">
|
||||
<ScreenReaderContent as=\\"span\\">
|
||||
<div
|
||||
className="delete"
|
||||
>
|
||||
<Button
|
||||
as="button"
|
||||
buttonRef={[Function]}
|
||||
cursor="pointer"
|
||||
disabled={false}
|
||||
fluidWidth={false}
|
||||
icon={<IconTrash />}
|
||||
margin="0"
|
||||
onClick={[Function]}
|
||||
size="medium"
|
||||
type="button"
|
||||
variant="icon"
|
||||
>
|
||||
<ScreenReaderContent
|
||||
as="span"
|
||||
>
|
||||
Delete proficiency rating
|
||||
</ScreenReaderContent>
|
||||
</Button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>"
|
||||
</tr>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,19 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`default proficiency renders the ProficiencyRating component 1`] = `
|
||||
"<div style={{...}}>
|
||||
<Spinner title=\\"Loading\\" size=\\"large\\" margin=\\"0 0 0 medium\\" as=\\"div\\" variant=\\"default\\" />
|
||||
</div>"
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"textAlign": "center",
|
||||
}
|
||||
}
|
||||
>
|
||||
<Spinner
|
||||
as="div"
|
||||
margin="0 0 0 medium"
|
||||
size="large"
|
||||
title="Loading"
|
||||
variant="default"
|
||||
/>
|
||||
</div>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -1,111 +1,385 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`The Ratings component only renders the single selected Rating with a footer in summary mode 1`] = `
|
||||
"<div className=\\"rating-tier selected\\" onClick={{...}} onKeyPress={[Function: onKeyPress]} role={{...}} style={{...}} tabIndex={{...}}>
|
||||
<div className=\\"rating-description\\">
|
||||
<Text size=\\"small\\" lineHeight=\\"condensed\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<div
|
||||
className="rating-tier selected"
|
||||
onClick={null}
|
||||
onKeyPress={[Function]}
|
||||
role={null}
|
||||
style={
|
||||
Object {
|
||||
"width": "100%",
|
||||
}
|
||||
}
|
||||
tabIndex={null}
|
||||
>
|
||||
<div
|
||||
className="rating-description"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
lineHeight="condensed"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
Meh
|
||||
</Text>
|
||||
</div>
|
||||
<Text size=\\"small\\" lineHeight=\\"condensed\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
lineHeight="condensed"
|
||||
size="small"
|
||||
>
|
||||
More Verbosity
|
||||
</Text>
|
||||
<div className=\\"rating-footer\\">
|
||||
<div
|
||||
className="rating-footer"
|
||||
>
|
||||
<div>
|
||||
ow my foot
|
||||
</div>
|
||||
</div>
|
||||
<div className=\\"shader nearMasteryShader\\" style={{...}} aria-label={{...}}>
|
||||
<div className=\\"triangle\\" style={{...}} />
|
||||
<div
|
||||
aria-label={null}
|
||||
className="shader nearMasteryShader"
|
||||
style={
|
||||
Object {
|
||||
"backgroundColor": null,
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="triangle"
|
||||
style={
|
||||
Object {
|
||||
"borderBottomColor": null,
|
||||
}
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</div>"
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`The Ratings component renders a default rating if none of the ratings are selected 1`] = `
|
||||
"<div className=\\"rating-tier\\" onClick={{...}} onKeyPress={[Function: onKeyPress]} role={{...}} style={{...}} tabIndex={{...}}>
|
||||
<div className=\\"rating-description\\">
|
||||
<Text size=\\"small\\" lineHeight=\\"condensed\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<div
|
||||
className="rating-tier"
|
||||
onClick={null}
|
||||
onKeyPress={[Function]}
|
||||
role={null}
|
||||
style={
|
||||
Object {
|
||||
"width": undefined,
|
||||
}
|
||||
}
|
||||
tabIndex={null}
|
||||
>
|
||||
<div
|
||||
className="rating-description"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
lineHeight="condensed"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
No details
|
||||
</Text>
|
||||
</div>
|
||||
<Text size=\\"small\\" lineHeight=\\"condensed\\" as=\\"span\\" letterSpacing=\\"normal\\" />
|
||||
<div className=\\"rating-footer\\">
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
lineHeight="condensed"
|
||||
size="small"
|
||||
/>
|
||||
<div
|
||||
className="rating-footer"
|
||||
>
|
||||
<div>
|
||||
ow my foot
|
||||
</div>
|
||||
</div>
|
||||
<div className=\\"shader\\" style={{...}} aria-label={{...}}>
|
||||
<div className=\\"triangle\\" style={{...}} />
|
||||
<div
|
||||
aria-label={null}
|
||||
className="shader"
|
||||
style={
|
||||
Object {
|
||||
"backgroundColor": undefined,
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="triangle"
|
||||
style={
|
||||
Object {
|
||||
"borderBottomColor": undefined,
|
||||
}
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</div>"
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`The Ratings component renders the Rating sub-components as expected when range rating enabled 1`] = `
|
||||
"<div className=\\"rating-tier\\" onClick={{...}} onKeyPress={[Function: onKeyPress]} role={{...}} style={{...}} tabIndex={{...}}>
|
||||
<div className=\\"rating-points\\">
|
||||
<Text size=\\"small\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<div
|
||||
className="rating-tier"
|
||||
onClick={null}
|
||||
onKeyPress={[Function]}
|
||||
role={null}
|
||||
style={
|
||||
Object {
|
||||
"width": "33.333333333333336%",
|
||||
}
|
||||
}
|
||||
tabIndex={null}
|
||||
>
|
||||
<div
|
||||
className="rating-points"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
10 to >5 pts
|
||||
</Text>
|
||||
</div>
|
||||
<div className=\\"rating-description\\">
|
||||
<Text size=\\"small\\" lineHeight=\\"condensed\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<div
|
||||
className="rating-description"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
lineHeight="condensed"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
Superb
|
||||
</Text>
|
||||
</div>
|
||||
<Text size=\\"small\\" lineHeight=\\"condensed\\" as=\\"span\\" letterSpacing=\\"normal\\" />
|
||||
<div className=\\"rating-footer\\" />
|
||||
<div className=\\"shader\\" style={{...}} aria-label={{...}}>
|
||||
<div className=\\"triangle\\" style={{...}} />
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
lineHeight="condensed"
|
||||
size="small"
|
||||
/>
|
||||
<div
|
||||
className="rating-footer"
|
||||
/>
|
||||
<div
|
||||
aria-label={null}
|
||||
className="shader"
|
||||
style={
|
||||
Object {
|
||||
"backgroundColor": "transparent",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="triangle"
|
||||
style={
|
||||
Object {
|
||||
"borderBottomColor": "transparent",
|
||||
}
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</div>"
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`The Ratings component renders the Rating sub-components as expected when range rating enabled 2`] = `
|
||||
"<div className=\\"rating-tier selected\\" onClick={{...}} onKeyPress={[Function: onKeyPress]} role={{...}} style={{...}} tabIndex={{...}}>
|
||||
<div className=\\"rating-points\\">
|
||||
<Text size=\\"small\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<div
|
||||
className="rating-tier selected"
|
||||
onClick={null}
|
||||
onKeyPress={[Function]}
|
||||
role={null}
|
||||
style={
|
||||
Object {
|
||||
"width": "33.333333333333336%",
|
||||
}
|
||||
}
|
||||
tabIndex={null}
|
||||
>
|
||||
<div
|
||||
className="rating-points"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
5 to >1 pts
|
||||
</Text>
|
||||
</div>
|
||||
<div className=\\"rating-description\\">
|
||||
<Text size=\\"small\\" lineHeight=\\"condensed\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<div
|
||||
className="rating-description"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
lineHeight="condensed"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
Meh
|
||||
</Text>
|
||||
</div>
|
||||
<Text size=\\"small\\" lineHeight=\\"condensed\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
lineHeight="condensed"
|
||||
size="small"
|
||||
>
|
||||
More Verbosity
|
||||
</Text>
|
||||
<div className=\\"rating-footer\\" />
|
||||
<div className=\\"shader nearMasteryShader\\" style={{...}} aria-label=\\"This rating is selected\\">
|
||||
<div className=\\"triangle\\" style={{...}} />
|
||||
<div
|
||||
className="rating-footer"
|
||||
/>
|
||||
<div
|
||||
aria-label="This rating is selected"
|
||||
className="shader nearMasteryShader"
|
||||
style={
|
||||
Object {
|
||||
"backgroundColor": null,
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="triangle"
|
||||
style={
|
||||
Object {
|
||||
"borderBottomColor": null,
|
||||
}
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</div>"
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`The Ratings component renders the Rating sub-components as expected when range rating enabled 3`] = `
|
||||
"<div className=\\"rating-tier\\" onClick={{...}} onKeyPress={[Function: onKeyPress]} role={{...}} style={{...}} tabIndex={{...}}>
|
||||
<div className=\\"rating-points\\">
|
||||
<Text size=\\"small\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<div
|
||||
className="rating-tier"
|
||||
onClick={null}
|
||||
onKeyPress={[Function]}
|
||||
role={null}
|
||||
style={
|
||||
Object {
|
||||
"width": "33.333333333333336%",
|
||||
}
|
||||
}
|
||||
tabIndex={null}
|
||||
>
|
||||
<div
|
||||
className="rating-points"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
1 to >0 pts
|
||||
</Text>
|
||||
</div>
|
||||
<div className=\\"rating-description\\">
|
||||
<Text size=\\"small\\" lineHeight=\\"condensed\\" weight=\\"bold\\" as=\\"span\\" letterSpacing=\\"normal\\">
|
||||
<div
|
||||
className="rating-description"
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
lineHeight="condensed"
|
||||
size="small"
|
||||
weight="bold"
|
||||
>
|
||||
Subpar
|
||||
</Text>
|
||||
</div>
|
||||
<Text size=\\"small\\" lineHeight=\\"condensed\\" as=\\"span\\" letterSpacing=\\"normal\\" />
|
||||
<div className=\\"rating-footer\\" />
|
||||
<div className=\\"shader\\" style={{...}} aria-label={{...}}>
|
||||
<div className=\\"triangle\\" style={{...}} />
|
||||
<Text
|
||||
as="span"
|
||||
letterSpacing="normal"
|
||||
lineHeight="condensed"
|
||||
size="small"
|
||||
/>
|
||||
<div
|
||||
className="rating-footer"
|
||||
/>
|
||||
<div
|
||||
aria-label={null}
|
||||
className="shader"
|
||||
style={
|
||||
Object {
|
||||
"backgroundColor": "transparent",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="triangle"
|
||||
style={
|
||||
Object {
|
||||
"borderBottomColor": "transparent",
|
||||
}
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</div>"
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`The Ratings component renders the root component as expected 1`] = `
|
||||
"<div className=\\"rating-tier-list\\">
|
||||
<Rating assessing={false} classes=\\"rating-tier\\" endOfRangePoints={{...}} footer={{...}} onClick={[Function: onClick]} shaderClass={{...}} tierColor=\\"transparent\\" hidePoints={false} isSummary={false} selected={false} width=\\"33.333333333333336%\\" description=\\"Superb\\" points={10} />
|
||||
<Rating assessing={false} classes=\\"rating-tier selected\\" endOfRangePoints={{...}} footer={{...}} onClick={[Function: onClick]} shaderClass=\\"nearMasteryShader\\" tierColor={{...}} hidePoints={false} isSummary={false} selected={true} width=\\"33.333333333333336%\\" description=\\"Meh\\" long_description=\\"More Verbosity\\" points={5} />
|
||||
<Rating assessing={false} classes=\\"rating-tier\\" endOfRangePoints={{...}} footer={{...}} onClick={[Function: onClick]} shaderClass={{...}} tierColor=\\"transparent\\" hidePoints={false} isSummary={false} selected={false} width=\\"33.333333333333336%\\" description=\\"Subpar\\" points={1} />
|
||||
</div>"
|
||||
<div
|
||||
className="rating-tier-list"
|
||||
>
|
||||
<Rating
|
||||
assessing={false}
|
||||
classes="rating-tier"
|
||||
description="Superb"
|
||||
endOfRangePoints={null}
|
||||
footer={null}
|
||||
hidePoints={false}
|
||||
isSummary={false}
|
||||
key="0"
|
||||
onClick={[Function]}
|
||||
points={10}
|
||||
selected={false}
|
||||
shaderClass={null}
|
||||
tierColor="transparent"
|
||||
width="33.333333333333336%"
|
||||
/>
|
||||
<Rating
|
||||
assessing={false}
|
||||
classes="rating-tier selected"
|
||||
description="Meh"
|
||||
endOfRangePoints={null}
|
||||
footer={null}
|
||||
hidePoints={false}
|
||||
isSummary={false}
|
||||
key="1"
|
||||
long_description="More Verbosity"
|
||||
onClick={[Function]}
|
||||
points={5}
|
||||
selected={true}
|
||||
shaderClass="nearMasteryShader"
|
||||
tierColor={null}
|
||||
width="33.333333333333336%"
|
||||
/>
|
||||
<Rating
|
||||
assessing={false}
|
||||
classes="rating-tier"
|
||||
description="Subpar"
|
||||
endOfRangePoints={null}
|
||||
footer={null}
|
||||
hidePoints={false}
|
||||
isSummary={false}
|
||||
key="2"
|
||||
onClick={[Function]}
|
||||
points={1}
|
||||
selected={false}
|
||||
shaderClass={null}
|
||||
tierColor="transparent"
|
||||
width="33.333333333333336%"
|
||||
/>
|
||||
</div>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -1,52 +1,343 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`the Rubric component hides the score total when needed 1`] = `
|
||||
"<div className=\\"react-rubric\\" style={{...}}>
|
||||
<Table caption=\\"Point Rubric\\" hover={false} size=\\"medium\\">
|
||||
<div
|
||||
className="react-rubric"
|
||||
style={
|
||||
Object {
|
||||
"minWidth": "52.5rem",
|
||||
}
|
||||
}
|
||||
>
|
||||
<Table
|
||||
caption="Point Rubric"
|
||||
hover={false}
|
||||
size="medium"
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope=\\"col\\" className={[undefined]}>
|
||||
<th
|
||||
scope="col"
|
||||
>
|
||||
Criteria
|
||||
</th>
|
||||
<th scope=\\"col\\" className=\\"ratings\\">
|
||||
<th
|
||||
className="ratings"
|
||||
scope="col"
|
||||
>
|
||||
Ratings
|
||||
</th>
|
||||
<th scope=\\"col\\">
|
||||
<th
|
||||
scope="col"
|
||||
>
|
||||
Pts
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className=\\"criterions\\">
|
||||
<Criterion allowExtraCredit={false} assessment={{...}} criterion={{...}} customRatings={{...}} freeForm={false} isSummary={false} onAssessmentChange={{...}} savedComments={{...}} hidePoints={false} hasPointsColumn={true} />
|
||||
<Criterion allowExtraCredit={false} assessment={{...}} criterion={{...}} customRatings={{...}} freeForm={false} isSummary={false} onAssessmentChange={{...}} savedComments={{...}} hidePoints={false} hasPointsColumn={true} />
|
||||
<tbody
|
||||
className="criterions"
|
||||
>
|
||||
<Criterion
|
||||
allowExtraCredit={false}
|
||||
assessment={
|
||||
Object {
|
||||
"comments": "i'd like to say some things",
|
||||
"comments_enabled": true,
|
||||
"criterion_id": "_1384",
|
||||
"description": "bleh",
|
||||
"id": "7_4778",
|
||||
"learning_outcome_id": null,
|
||||
"points": Object {
|
||||
"text": null,
|
||||
"valid": true,
|
||||
"value": 3.2,
|
||||
},
|
||||
}
|
||||
}
|
||||
criterion={
|
||||
Object {
|
||||
"criterion_use_range": false,
|
||||
"description": "Description of criterion",
|
||||
"id": "_1384",
|
||||
"long_description": "",
|
||||
"points": 8,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"criterion_id": "_1384",
|
||||
"description": "Full Marks",
|
||||
"id": "blank",
|
||||
"long_description": "",
|
||||
"points": 8,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "_1384",
|
||||
"description": "bleh",
|
||||
"id": "7_4778",
|
||||
"long_description": "blah",
|
||||
"points": 3,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "_1384",
|
||||
"description": "No Marks",
|
||||
"id": "blank_2",
|
||||
"long_description": "",
|
||||
"points": 0,
|
||||
},
|
||||
],
|
||||
}
|
||||
}
|
||||
customRatings={Array []}
|
||||
freeForm={false}
|
||||
hasPointsColumn={true}
|
||||
hidePoints={false}
|
||||
isSummary={false}
|
||||
key="_1384"
|
||||
onAssessmentChange={null}
|
||||
savedComments={Array []}
|
||||
/>
|
||||
<Criterion
|
||||
allowExtraCredit={false}
|
||||
assessment={
|
||||
Object {
|
||||
"above_threshold": false,
|
||||
"comments": "here too",
|
||||
"comments_enabled": true,
|
||||
"criterion_id": "7_391",
|
||||
"description": "Naturligvis hadde han ogsaa længe forstaat hvorfor Inger hadde.",
|
||||
"id": "7_6639",
|
||||
"learning_outcome_id": "612",
|
||||
"points": Object {
|
||||
"text": null,
|
||||
"valid": true,
|
||||
"value": 3,
|
||||
},
|
||||
}
|
||||
}
|
||||
criterion={
|
||||
Object {
|
||||
"criterion_use_range": false,
|
||||
"description": "Javel, Isak hadde ogsaa lauvet kraftig og hadde nu en Mængde Lauv av bedste Slag.",
|
||||
"id": "7_391",
|
||||
"ignore_for_scoring": false,
|
||||
"learning_outcome_id": "612",
|
||||
"long_description": "sa Sivert.",
|
||||
"mastery_points": 3,
|
||||
"points": 3,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"criterion_id": "7_391",
|
||||
"description": "Naturligvis hadde han ogsaa længe forstaat hvorfor Inger hadde ordet om.",
|
||||
"id": "7_6639",
|
||||
"long_description": "",
|
||||
"points": 3,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "7_391",
|
||||
"description": "De levet tæt hos hverandre som Dyr i Skogen, de sov og spiste, det lidde saa.",
|
||||
"id": "7_194",
|
||||
"long_description": "",
|
||||
"points": 2,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "7_391",
|
||||
"description": "Et graat og rødt Uldtørklæde med Frynser var pragtfuldt paa hendes mørke Haar.",
|
||||
"id": "7_8479",
|
||||
"long_description": "",
|
||||
"points": 1,
|
||||
},
|
||||
],
|
||||
}
|
||||
}
|
||||
customRatings={Array []}
|
||||
freeForm={false}
|
||||
hasPointsColumn={true}
|
||||
hidePoints={false}
|
||||
isSummary={false}
|
||||
key="7_391"
|
||||
onAssessmentChange={null}
|
||||
savedComments={Array []}
|
||||
/>
|
||||
</tbody>
|
||||
</Table>
|
||||
</div>"
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`the Rubric component renders as expected 1`] = `
|
||||
"<div className=\\"react-rubric\\" style={{...}}>
|
||||
<Table caption=\\"Point Rubric\\" hover={false} size=\\"medium\\">
|
||||
<div
|
||||
className="react-rubric"
|
||||
style={
|
||||
Object {
|
||||
"minWidth": "52.5rem",
|
||||
}
|
||||
}
|
||||
>
|
||||
<Table
|
||||
caption="Point Rubric"
|
||||
hover={false}
|
||||
size="medium"
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope=\\"col\\" className={[undefined]}>
|
||||
<th
|
||||
scope="col"
|
||||
>
|
||||
Criteria
|
||||
</th>
|
||||
<th scope=\\"col\\" className=\\"ratings\\">
|
||||
<th
|
||||
className="ratings"
|
||||
scope="col"
|
||||
>
|
||||
Ratings
|
||||
</th>
|
||||
<th scope=\\"col\\">
|
||||
<th
|
||||
scope="col"
|
||||
>
|
||||
Pts
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className=\\"criterions\\">
|
||||
<Criterion allowExtraCredit={false} assessment={{...}} criterion={{...}} customRatings={{...}} freeForm={false} isSummary={false} onAssessmentChange={{...}} savedComments={{...}} hidePoints={false} hasPointsColumn={true} />
|
||||
<Criterion allowExtraCredit={false} assessment={{...}} criterion={{...}} customRatings={{...}} freeForm={false} isSummary={false} onAssessmentChange={{...}} savedComments={{...}} hidePoints={false} hasPointsColumn={true} />
|
||||
<tbody
|
||||
className="criterions"
|
||||
>
|
||||
<Criterion
|
||||
allowExtraCredit={false}
|
||||
assessment={
|
||||
Object {
|
||||
"comments": "i'd like to say some things",
|
||||
"comments_enabled": true,
|
||||
"criterion_id": "_1384",
|
||||
"description": "bleh",
|
||||
"id": "7_4778",
|
||||
"learning_outcome_id": null,
|
||||
"points": Object {
|
||||
"text": null,
|
||||
"valid": true,
|
||||
"value": 3.2,
|
||||
},
|
||||
}
|
||||
}
|
||||
criterion={
|
||||
Object {
|
||||
"criterion_use_range": false,
|
||||
"description": "Description of criterion",
|
||||
"id": "_1384",
|
||||
"long_description": "",
|
||||
"points": 8,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"criterion_id": "_1384",
|
||||
"description": "Full Marks",
|
||||
"id": "blank",
|
||||
"long_description": "",
|
||||
"points": 8,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "_1384",
|
||||
"description": "bleh",
|
||||
"id": "7_4778",
|
||||
"long_description": "blah",
|
||||
"points": 3,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "_1384",
|
||||
"description": "No Marks",
|
||||
"id": "blank_2",
|
||||
"long_description": "",
|
||||
"points": 0,
|
||||
},
|
||||
],
|
||||
}
|
||||
}
|
||||
customRatings={Array []}
|
||||
freeForm={false}
|
||||
hasPointsColumn={true}
|
||||
hidePoints={false}
|
||||
isSummary={false}
|
||||
key="_1384"
|
||||
onAssessmentChange={null}
|
||||
savedComments={Array []}
|
||||
/>
|
||||
<Criterion
|
||||
allowExtraCredit={false}
|
||||
assessment={
|
||||
Object {
|
||||
"above_threshold": false,
|
||||
"comments": "here too",
|
||||
"comments_enabled": true,
|
||||
"criterion_id": "7_391",
|
||||
"description": "Naturligvis hadde han ogsaa længe forstaat hvorfor Inger hadde.",
|
||||
"id": "7_6639",
|
||||
"learning_outcome_id": "612",
|
||||
"points": Object {
|
||||
"text": null,
|
||||
"valid": true,
|
||||
"value": 3,
|
||||
},
|
||||
}
|
||||
}
|
||||
criterion={
|
||||
Object {
|
||||
"criterion_use_range": false,
|
||||
"description": "Javel, Isak hadde ogsaa lauvet kraftig og hadde nu en Mængde Lauv av bedste Slag.",
|
||||
"id": "7_391",
|
||||
"ignore_for_scoring": false,
|
||||
"learning_outcome_id": "612",
|
||||
"long_description": "sa Sivert.",
|
||||
"mastery_points": 3,
|
||||
"points": 3,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"criterion_id": "7_391",
|
||||
"description": "Naturligvis hadde han ogsaa længe forstaat hvorfor Inger hadde ordet om.",
|
||||
"id": "7_6639",
|
||||
"long_description": "",
|
||||
"points": 3,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "7_391",
|
||||
"description": "De levet tæt hos hverandre som Dyr i Skogen, de sov og spiste, det lidde saa.",
|
||||
"id": "7_194",
|
||||
"long_description": "",
|
||||
"points": 2,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "7_391",
|
||||
"description": "Et graat og rødt Uldtørklæde med Frynser var pragtfuldt paa hendes mørke Haar.",
|
||||
"id": "7_8479",
|
||||
"long_description": "",
|
||||
"points": 1,
|
||||
},
|
||||
],
|
||||
}
|
||||
}
|
||||
customRatings={Array []}
|
||||
freeForm={false}
|
||||
hasPointsColumn={true}
|
||||
hidePoints={false}
|
||||
isSummary={false}
|
||||
key="7_391"
|
||||
onAssessmentChange={null}
|
||||
savedComments={Array []}
|
||||
/>
|
||||
<tr>
|
||||
<td colSpan=\\"3\\">
|
||||
<Flex justifyItems=\\"end\\" as=\\"span\\" direction=\\"row\\" alignItems=\\"center\\" inline={false} visualDebug={false} wrapItems={false}>
|
||||
<FlexItem data-selenium=\\"rubric_total\\" as=\\"span\\" grow={false} shrink={false}>
|
||||
<td
|
||||
colSpan="3"
|
||||
>
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="end"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
data-selenium="rubric_total"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
Total Points: 6
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
|
|
@ -54,32 +345,156 @@ exports[`the Rubric component renders as expected 1`] = `
|
|||
</tr>
|
||||
</tbody>
|
||||
</Table>
|
||||
</div>"
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`the Rubric component renders properly with no assessment 1`] = `
|
||||
"<div className=\\"react-rubric\\" style={{...}}>
|
||||
<Table caption=\\"Point Rubric\\" hover={false} size=\\"medium\\">
|
||||
<div
|
||||
className="react-rubric"
|
||||
style={
|
||||
Object {
|
||||
"minWidth": "52.5rem",
|
||||
}
|
||||
}
|
||||
>
|
||||
<Table
|
||||
caption="Point Rubric"
|
||||
hover={false}
|
||||
size="medium"
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope=\\"col\\" className={[undefined]}>
|
||||
<th
|
||||
scope="col"
|
||||
>
|
||||
Criteria
|
||||
</th>
|
||||
<th scope=\\"col\\" className=\\"ratings\\">
|
||||
<th
|
||||
className="ratings"
|
||||
scope="col"
|
||||
>
|
||||
Ratings
|
||||
</th>
|
||||
<th scope=\\"col\\">
|
||||
<th
|
||||
scope="col"
|
||||
>
|
||||
Pts
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className=\\"criterions\\">
|
||||
<Criterion allowExtraCredit={false} assessment={{...}} criterion={{...}} customRatings={{...}} freeForm={false} isSummary={false} onAssessmentChange={{...}} savedComments={{...}} hidePoints={false} hasPointsColumn={true} />
|
||||
<Criterion allowExtraCredit={false} assessment={{...}} criterion={{...}} customRatings={{...}} freeForm={false} isSummary={false} onAssessmentChange={{...}} savedComments={{...}} hidePoints={false} hasPointsColumn={true} />
|
||||
<tbody
|
||||
className="criterions"
|
||||
>
|
||||
<Criterion
|
||||
allowExtraCredit={false}
|
||||
assessment={null}
|
||||
criterion={
|
||||
Object {
|
||||
"criterion_use_range": false,
|
||||
"description": "Description of criterion",
|
||||
"id": "_1384",
|
||||
"long_description": "",
|
||||
"points": 8,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"criterion_id": "_1384",
|
||||
"description": "Full Marks",
|
||||
"id": "blank",
|
||||
"long_description": "",
|
||||
"points": 8,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "_1384",
|
||||
"description": "bleh",
|
||||
"id": "7_4778",
|
||||
"long_description": "blah",
|
||||
"points": 3,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "_1384",
|
||||
"description": "No Marks",
|
||||
"id": "blank_2",
|
||||
"long_description": "",
|
||||
"points": 0,
|
||||
},
|
||||
],
|
||||
}
|
||||
}
|
||||
customRatings={Array []}
|
||||
freeForm={false}
|
||||
hasPointsColumn={true}
|
||||
hidePoints={false}
|
||||
isSummary={false}
|
||||
key="_1384"
|
||||
onAssessmentChange={null}
|
||||
savedComments={Array []}
|
||||
/>
|
||||
<Criterion
|
||||
allowExtraCredit={false}
|
||||
assessment={null}
|
||||
criterion={
|
||||
Object {
|
||||
"criterion_use_range": false,
|
||||
"description": "Javel, Isak hadde ogsaa lauvet kraftig og hadde nu en Mængde Lauv av bedste Slag.",
|
||||
"id": "7_391",
|
||||
"ignore_for_scoring": false,
|
||||
"learning_outcome_id": "612",
|
||||
"long_description": "sa Sivert.",
|
||||
"mastery_points": 3,
|
||||
"points": 3,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"criterion_id": "7_391",
|
||||
"description": "Naturligvis hadde han ogsaa længe forstaat hvorfor Inger hadde ordet om.",
|
||||
"id": "7_6639",
|
||||
"long_description": "",
|
||||
"points": 3,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "7_391",
|
||||
"description": "De levet tæt hos hverandre som Dyr i Skogen, de sov og spiste, det lidde saa.",
|
||||
"id": "7_194",
|
||||
"long_description": "",
|
||||
"points": 2,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "7_391",
|
||||
"description": "Et graat og rødt Uldtørklæde med Frynser var pragtfuldt paa hendes mørke Haar.",
|
||||
"id": "7_8479",
|
||||
"long_description": "",
|
||||
"points": 1,
|
||||
},
|
||||
],
|
||||
}
|
||||
}
|
||||
customRatings={Array []}
|
||||
freeForm={false}
|
||||
hasPointsColumn={true}
|
||||
hidePoints={false}
|
||||
isSummary={false}
|
||||
key="7_391"
|
||||
onAssessmentChange={null}
|
||||
savedComments={Array []}
|
||||
/>
|
||||
<tr>
|
||||
<td colSpan=\\"3\\">
|
||||
<Flex justifyItems=\\"end\\" as=\\"span\\" direction=\\"row\\" alignItems=\\"center\\" inline={false} visualDebug={false} wrapItems={false}>
|
||||
<FlexItem data-selenium=\\"rubric_total\\" as=\\"span\\" grow={false} shrink={false}>
|
||||
<td
|
||||
colSpan="3"
|
||||
>
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="end"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
data-selenium="rubric_total"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
Total Points: 11
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
|
|
@ -87,32 +502,184 @@ exports[`the Rubric component renders properly with no assessment 1`] = `
|
|||
</tr>
|
||||
</tbody>
|
||||
</Table>
|
||||
</div>"
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`the Rubric component updates the total score when an individual criterion point assessment changes 1`] = `
|
||||
"<div className=\\"react-rubric\\" style={{...}}>
|
||||
<Table caption=\\"Point Rubric\\" hover={false} size=\\"medium\\">
|
||||
<div
|
||||
className="react-rubric"
|
||||
style={
|
||||
Object {
|
||||
"minWidth": "52.5rem",
|
||||
}
|
||||
}
|
||||
>
|
||||
<Table
|
||||
caption="Point Rubric"
|
||||
hover={false}
|
||||
size="medium"
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope=\\"col\\" className={[undefined]}>
|
||||
<th
|
||||
scope="col"
|
||||
>
|
||||
Criteria
|
||||
</th>
|
||||
<th scope=\\"col\\" className=\\"ratings\\">
|
||||
<th
|
||||
className="ratings"
|
||||
scope="col"
|
||||
>
|
||||
Ratings
|
||||
</th>
|
||||
<th scope=\\"col\\">
|
||||
<th
|
||||
scope="col"
|
||||
>
|
||||
Pts
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className=\\"criterions\\">
|
||||
<Criterion allowExtraCredit={false} assessment={{...}} criterion={{...}} customRatings={{...}} freeForm={false} isSummary={false} onAssessmentChange={[Function]} savedComments={{...}} hidePoints={false} hasPointsColumn={true} />
|
||||
<Criterion allowExtraCredit={false} assessment={{...}} criterion={{...}} customRatings={{...}} freeForm={false} isSummary={false} onAssessmentChange={[Function]} savedComments={{...}} hidePoints={false} hasPointsColumn={true} />
|
||||
<tbody
|
||||
className="criterions"
|
||||
>
|
||||
<Criterion
|
||||
allowExtraCredit={false}
|
||||
assessment={
|
||||
Object {
|
||||
"comments": "i'd like to say some things",
|
||||
"comments_enabled": true,
|
||||
"criterion_id": "_1384",
|
||||
"description": "bleh",
|
||||
"id": "7_4778",
|
||||
"learning_outcome_id": null,
|
||||
"points": Object {
|
||||
"valid": true,
|
||||
"value": 2,
|
||||
},
|
||||
}
|
||||
}
|
||||
criterion={
|
||||
Object {
|
||||
"criterion_use_range": false,
|
||||
"description": "Description of criterion",
|
||||
"id": "_1384",
|
||||
"long_description": "",
|
||||
"points": 8,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"criterion_id": "_1384",
|
||||
"description": "Full Marks",
|
||||
"id": "blank",
|
||||
"long_description": "",
|
||||
"points": 8,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "_1384",
|
||||
"description": "bleh",
|
||||
"id": "7_4778",
|
||||
"long_description": "blah",
|
||||
"points": 3,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "_1384",
|
||||
"description": "No Marks",
|
||||
"id": "blank_2",
|
||||
"long_description": "",
|
||||
"points": 0,
|
||||
},
|
||||
],
|
||||
}
|
||||
}
|
||||
customRatings={Array []}
|
||||
freeForm={false}
|
||||
hasPointsColumn={true}
|
||||
hidePoints={false}
|
||||
isSummary={false}
|
||||
key="_1384"
|
||||
onAssessmentChange={[Function]}
|
||||
savedComments={Array []}
|
||||
/>
|
||||
<Criterion
|
||||
allowExtraCredit={false}
|
||||
assessment={
|
||||
Object {
|
||||
"above_threshold": false,
|
||||
"comments": "here too",
|
||||
"comments_enabled": true,
|
||||
"criterion_id": "7_391",
|
||||
"description": "Naturligvis hadde han ogsaa længe forstaat hvorfor Inger hadde.",
|
||||
"id": "7_6639",
|
||||
"learning_outcome_id": "612",
|
||||
"points": Object {
|
||||
"text": null,
|
||||
"valid": true,
|
||||
"value": 3,
|
||||
},
|
||||
}
|
||||
}
|
||||
criterion={
|
||||
Object {
|
||||
"criterion_use_range": false,
|
||||
"description": "Javel, Isak hadde ogsaa lauvet kraftig og hadde nu en Mængde Lauv av bedste Slag.",
|
||||
"id": "7_391",
|
||||
"ignore_for_scoring": false,
|
||||
"learning_outcome_id": "612",
|
||||
"long_description": "sa Sivert.",
|
||||
"mastery_points": 3,
|
||||
"points": 3,
|
||||
"ratings": Array [
|
||||
Object {
|
||||
"criterion_id": "7_391",
|
||||
"description": "Naturligvis hadde han ogsaa længe forstaat hvorfor Inger hadde ordet om.",
|
||||
"id": "7_6639",
|
||||
"long_description": "",
|
||||
"points": 3,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "7_391",
|
||||
"description": "De levet tæt hos hverandre som Dyr i Skogen, de sov og spiste, det lidde saa.",
|
||||
"id": "7_194",
|
||||
"long_description": "",
|
||||
"points": 2,
|
||||
},
|
||||
Object {
|
||||
"criterion_id": "7_391",
|
||||
"description": "Et graat og rødt Uldtørklæde med Frynser var pragtfuldt paa hendes mørke Haar.",
|
||||
"id": "7_8479",
|
||||
"long_description": "",
|
||||
"points": 1,
|
||||
},
|
||||
],
|
||||
}
|
||||
}
|
||||
customRatings={Array []}
|
||||
freeForm={false}
|
||||
hasPointsColumn={true}
|
||||
hidePoints={false}
|
||||
isSummary={false}
|
||||
key="7_391"
|
||||
onAssessmentChange={[Function]}
|
||||
savedComments={Array []}
|
||||
/>
|
||||
<tr>
|
||||
<td colSpan=\\"3\\">
|
||||
<Flex justifyItems=\\"end\\" as=\\"span\\" direction=\\"row\\" alignItems=\\"center\\" inline={false} visualDebug={false} wrapItems={false}>
|
||||
<FlexItem data-selenium=\\"rubric_total\\" as=\\"span\\" grow={false} shrink={false}>
|
||||
<td
|
||||
colSpan="3"
|
||||
>
|
||||
<Flex
|
||||
alignItems="center"
|
||||
as="span"
|
||||
direction="row"
|
||||
inline={false}
|
||||
justifyItems="end"
|
||||
visualDebug={false}
|
||||
wrapItems={false}
|
||||
>
|
||||
<FlexItem
|
||||
as="span"
|
||||
data-selenium="rubric_total"
|
||||
grow={false}
|
||||
shrink={false}
|
||||
>
|
||||
Total Points: 5 out of 11
|
||||
</FlexItem>
|
||||
</Flex>
|
||||
|
|
@ -120,5 +687,5 @@ exports[`the Rubric component updates the total score when an individual criteri
|
|||
</tr>
|
||||
</tbody>
|
||||
</Table>
|
||||
</div>"
|
||||
</div>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -1,12 +1,35 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`renders the RubricManagement component 1`] = `
|
||||
"<TabList defaultSelectedIndex={0} variant=\\"simple\\" focus={false}>
|
||||
<TabPanel title=\\"Account Rubrics\\" id={{...}} variant=\\"simple\\" labelledBy={{...}} selected={false} padding=\\"small\\" tabRef={[Function: tabRef]}>
|
||||
<TabList
|
||||
defaultSelectedIndex={0}
|
||||
focus={false}
|
||||
variant="simple"
|
||||
>
|
||||
<TabPanel
|
||||
id={null}
|
||||
labelledBy={null}
|
||||
padding="small"
|
||||
selected={false}
|
||||
tabRef={[Function]}
|
||||
title="Account Rubrics"
|
||||
variant="simple"
|
||||
>
|
||||
<RubricPanel />
|
||||
</TabPanel>
|
||||
<TabPanel title=\\"Learning Mastery\\" id={{...}} variant=\\"simple\\" labelledBy={{...}} selected={false} padding=\\"small\\" tabRef={[Function: tabRef]}>
|
||||
<ProficiencyTable focusTab={[Function]} accountId=\\"1\\" />
|
||||
<TabPanel
|
||||
id={null}
|
||||
labelledBy={null}
|
||||
padding="small"
|
||||
selected={false}
|
||||
tabRef={[Function]}
|
||||
title="Learning Mastery"
|
||||
variant="simple"
|
||||
>
|
||||
<ProficiencyTable
|
||||
accountId="1"
|
||||
focusTab={[Function]}
|
||||
/>
|
||||
</TabPanel>
|
||||
</TabList>"
|
||||
</TabList>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -11,6 +11,9 @@ module.exports = {
|
|||
'public/javascripts/vendor'
|
||||
],
|
||||
reporters: [ "default", "jest-junit" ],
|
||||
snapshotSerializers: [
|
||||
'enzyme-to-json/serializer'
|
||||
],
|
||||
setupFiles: [
|
||||
'jest-localstorage-mock',
|
||||
'jest-canvas-mock',
|
||||
|
|
|
|||
|
|
@ -125,6 +125,7 @@
|
|||
"ember-template-compiler": "^1.8.0",
|
||||
"enzyme": "^3",
|
||||
"enzyme-adapter-react-16": "^1",
|
||||
"enzyme-to-json": "^3.3.4",
|
||||
"es-check": "^2.1.0",
|
||||
"eslint": "^4",
|
||||
"eslint-config-airbnb": "^16.1.0",
|
||||
|
|
|
|||
|
|
@ -5907,7 +5907,7 @@ enzyme-adapter-utils@^1.8.0:
|
|||
object.assign "^4.1.0"
|
||||
prop-types "^15.6.2"
|
||||
|
||||
enzyme-to-json@^3:
|
||||
enzyme-to-json@^3, enzyme-to-json@^3.3.4:
|
||||
version "3.3.4"
|
||||
resolved "https://registry.yarnpkg.com/enzyme-to-json/-/enzyme-to-json-3.3.4.tgz#67c6040e931182f183418af2eb9f4323258aa77f"
|
||||
integrity sha1-Z8YEDpMRgvGDQYry659DIyWKp38=
|
||||
|
|
|
|||
Loading…
Reference in New Issue