ylqjgm
/
canvas-lms
mirror of https://github.com/instructure/canvas-lms.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Only show Delete button when editing existing todo 

also fix the <h2> in the UpdateItemTray when editing v. creating new
item

fixes ADMIN-1084

test plan:
  - click + to create a to do
  > expect a Save, but no other button at the bottom of the tray
  > expect a screenreader to say "Add To Do" as you start reading the
    tray
  - create the to do, or click on an existing to do in the planner
  > expect the try to open with the to do's data
  > expect there to be delete and save buttons
  > expect a screen reader to read an h2 that says
    "Edit <title of your to do here>"
    as you start reading the tray

Change-Id: I21dc1a698bfedd91e697a28cf562bfaafeb926ba
Reviewed-on: https://gerrit.instructure.com/151906
Tested-by: Jenkins
Reviewed-by: Jon Willesen <jonw+gerrit@instructure.com>
QA-Review: Luke Kingsley <lkingsley@instructure.com>
Product-Review: Jon Willesen <jonw+gerrit@instructure.com>
This commit is contained in:
Ed Schiebel 2018-05-30 14:29:28 -04:00 committed by Jon Willesen
parent f7a7974c1e
commit 76a9033f17
2 changed files with 21 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
packages/canvas-planner/src/components/UpdateItemTray/__tests__/UpdateItemTray.spec.js
View File

@ -26,9 +26,10 @@ const defaultProps = {
timeZone: 'Asia/Tokyo',
onDeletePlannerItem: () => {},
courses: [],
noteItem: {},
};
const simpleItem = (opts = {}) => Object.assign({title: '', date: moment('2017-04-28T11:00:00Z')}, opts);
const simpleItem = (opts = {}) => Object.assign({uniqueId: "1", title: '', date: moment('2017-04-28T11:00:00Z')}, opts);
afterEach(()=> {
jest.restoreAllMocks();
@ -36,6 +37,7 @@ afterEach(()=> {
it('renders the item to update if provided', () => {
const noteItem = {
uniqueId: "1",
title: 'Planner Item',
date: moment('2017-04-25 01:49:00-0700'),
context: {id: '1'},
@ -104,6 +106,7 @@ it('correctly updates id to null when courseid is none', () => {
wrapper.instance().handleCourseIdChange({target: {value: 'none'}});
wrapper.instance().handleSave();
expect(mockCallback).toHaveBeenCalledWith({
uniqueId: "1",
title: item.title,
date: item.date.toISOString(),
context: {
@ -134,7 +137,7 @@ it('does not set an initial error message on title', () => {
});
it('sets error message on title field when title is set to blank', () => {
const wrapper = shallow(<UpdateItemTray {...defaultProps} noteItem={{title: 'an item'}} />);
const wrapper = shallow(<UpdateItemTray {...defaultProps} noteItem={{uniqueId: "1", title: 'an item'}} />);
wrapper.instance().handleTitleChange({target: {value: ''}});
const titleInput = wrapper.find('TextInput').first();
const messages = titleInput.props().messages;
@ -143,7 +146,7 @@ it('sets error message on title field when title is set to blank', () => {
});
it('clears the error message when a title is typed in', () => {
const wrapper = shallow(<UpdateItemTray {...defaultProps} noteItem={{title: 'an item'}} />);
const wrapper = shallow(<UpdateItemTray {...defaultProps} noteItem={{uniqueId: "1", title: 'an item'}} />);
wrapper.instance().handleTitleChange({target: {value: ''}});
wrapper.instance().handleTitleChange({target: {value: 't'}});
const titleInput = wrapper.find('TextInput').first();
@ -189,6 +192,7 @@ it('changes state when new date is typed in', () => {
wrapper.instance().handleDateChange({}, newDate.toISOString());
wrapper.instance().handleSave();
expect(mockCallback).toHaveBeenCalledWith({
uniqueId: "1",
title: noteItem.title,
date: newDate.toISOString(),
context: {id: null}
@ -208,6 +212,7 @@ it('updates state when new note is passed in', () => {
expect(wrapper).toMatchSnapshot();
const noteItem2 = simpleItem({
uniqueId: "2",
title: 'Planner Item 2',
context: {id: '2'},
details: "This is another reminder"
@ -225,7 +230,7 @@ it('does not render the delete button if an item is not specified', () => {
});
it('does render the delete button if an item is specified', () => {
const wrapper = shallow(<UpdateItemTray {...defaultProps} noteItem={{title: 'some note'}} />);
const wrapper = shallow(<UpdateItemTray {...defaultProps} noteItem={{uniqueId: "1", title: 'some note'}} />);
const deleteButton = wrapper.find('Button[variant="light"]');
expect(deleteButton).toHaveLength(1);
});
@ -247,7 +252,7 @@ it('invokes save callback with updated data', () => {
const saveMock = jest.fn();
const wrapper = shallow(<UpdateItemTray {...defaultProps}
noteItem={{
title: 'title', date: moment('2017-04-27T13:00:00Z'), courseId: '42', details: 'details',
uniqueId: "1", title: 'title', date: moment('2017-04-27T13:00:00Z'), courseId: '42', details: 'details',
}}
courses={[{id: '42', longName: 'first'}, {id: '43', longName: 'second'}]}
onSavePlannerItem={saveMock}
@ -258,7 +263,11 @@ it('invokes save callback with updated data', () => {
wrapper.instance().handleChange('details', 'new details');
wrapper.instance().handleSave();
expect(saveMock).toHaveBeenCalledWith({
title: 'new title', date: moment('2017-05-01T14:00:00Z').toISOString(), context: {id: '43'}, details: 'new details',
uniqueId: "1",
title: 'new title',
date: moment('2017-05-01T14:00:00Z').toISOString(),
context: {id: '43'},
details: 'new details',
});
});

8
packages/canvas-planner/src/components/UpdateItemTray/index.js
View File

@ -61,6 +61,10 @@ export class UpdateItemTray extends Component {
}
}
editingExistingNote () {
return this.props.noteItem && this.props.noteItem.uniqueId
}
getNoteUpdates (props) {
const updates = _.cloneDeep(props.noteItem) || {};
if (updates.context) {
@ -158,7 +162,7 @@ export class UpdateItemTray extends Component {
}
renderDeleteButton () {
if (this.props.noteItem == null) return;
if (!this.editingExistingNote()) return;
return <Button
variant="light"
margin="0 x-small 0 0"
@ -248,7 +252,7 @@ export class UpdateItemTray extends Component {
}
renderTrayHeader () {
if (this.props.noteItem) {
if (this.editingExistingNote()) {
return (
<h2>{formatMessage('Edit {title}', { title: this.props.noteItem.title })}</h2>
);