[ci skip] Init testing vue app for issue notes
This commit is contained in:
Filipa Lacerda
parent
b1a2b43fbb
commit
15441f0ef5
7 changed files with 78 additions and 41 deletions
|
|
@ -175,6 +175,7 @@
|
|||
this.noteType = type;
|
||||
},
|
||||
editCurrentUserLastNote() {
|
||||
console.log('editCurrentUserLastNote')
|
||||
if (this.note === '') {
|
||||
const lastNote = this.getCurrentUserLastNote(window.gon.current_user_id);
|
||||
|
||||
|
|
@ -228,9 +229,8 @@
|
|||
:quick-actions-docs="quickActionsDocsUrl"
|
||||
:add-spacing-classes="false">
|
||||
<textarea
|
||||
id="note-body"
|
||||
name="note[note]"
|
||||
class="note-textarea js-gfm-input js-autosize markdown-area"
|
||||
class="note-textarea js-vue-comment-form js-gfm-input js-autosize markdown-area"
|
||||
data-supports-quick-actions="true"
|
||||
aria-label="Description"
|
||||
v-model="note"
|
||||
|
|
|
|||
|
|
@ -60,10 +60,9 @@
|
|||
},
|
||||
deleteHandler() {
|
||||
// eslint-disable-next-line no-alert
|
||||
const isConfirmed = confirm('Are you sure you want to delete this list?');
|
||||
|
||||
if (isConfirmed) {
|
||||
if (confirm('Are you sure you want to delete this list?')) {
|
||||
this.isDeleting = true;
|
||||
|
||||
this.deleteNote(this.note)
|
||||
.then(() => {
|
||||
this.isDeleting = false;
|
||||
|
|
@ -149,8 +148,8 @@
|
|||
:can-delete="note.current_user.can_edit"
|
||||
:can-report-as-abuse="canReportAsAbuse"
|
||||
:report-abuse-path="note.report_abuse_path"
|
||||
:edit-handler="editHandler"
|
||||
:delete-handler="deleteHandler"
|
||||
@editHandler="editHandler"
|
||||
@deleteHandler="deleteHandler"
|
||||
/>
|
||||
</div>
|
||||
<issue-note-body
|
||||
|
|
|
|||
|
|
@ -37,14 +37,6 @@
|
|||
type: Boolean,
|
||||
required: true,
|
||||
},
|
||||
editHandler: {
|
||||
type: Function,
|
||||
required: true,
|
||||
},
|
||||
deleteHandler: {
|
||||
type: Function,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
directives: {
|
||||
tooltip,
|
||||
|
|
@ -76,6 +68,14 @@
|
|||
return this.getUserDataByProp('id');
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
onEdit() {
|
||||
this.$emit('editHandler');
|
||||
},
|
||||
onDelete() {
|
||||
this.$emit('deleteHandler');
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
@ -125,7 +125,7 @@
|
|||
<template v-if="canEdit">
|
||||
<li>
|
||||
<button
|
||||
@click="editHandler"
|
||||
@click="onEdit"
|
||||
type="button"
|
||||
class="btn btn-transparent js-note-edit">
|
||||
Edit comment
|
||||
|
|
@ -140,7 +140,7 @@
|
|||
</li>
|
||||
<li v-if="canEdit">
|
||||
<button
|
||||
@click.prevent="deleteHandler"
|
||||
@click.prevent="onDelete"
|
||||
class="btn btn-transparent js-note-delete js-note-delete"
|
||||
type="button">
|
||||
<span class="text-danger">
|
||||
|
|
|
|||
|
|
@ -118,8 +118,7 @@
|
|||
</div>
|
||||
<div class="flash-container timeline-content"></div>
|
||||
<form
|
||||
class="edit-note common-note-form"
|
||||
@submit="handleUpdate">
|
||||
class="edit-note common-note-form">
|
||||
<markdown-field
|
||||
:markdown-preview-url="markdownPreviewUrl"
|
||||
:markdown-docs="markdownDocsUrl"
|
||||
|
|
@ -128,7 +127,7 @@
|
|||
<textarea
|
||||
id="note-body"
|
||||
name="note[note]"
|
||||
class="note-textarea js-gfm-input js-autosize markdown-area"
|
||||
class="note-textarea js-gfm-input js-autosize markdown-area js-vue-issue-note-form"
|
||||
:data-supports-quick-actions="!isEditing"
|
||||
aria-label="Description"
|
||||
v-model="note"
|
||||
|
|
@ -143,8 +142,9 @@
|
|||
<div class="note-form-actions clearfix">
|
||||
<button
|
||||
type="submit"
|
||||
@click="handleUpdate"
|
||||
:disabled="isDisabled"
|
||||
class="btn btn-nr btn-save">
|
||||
class="js-vue-issue-save btn btn-save">
|
||||
{{saveButtonTitle}}
|
||||
</button>
|
||||
<button
|
||||
|
|
|
|||
|
|
@ -113,9 +113,11 @@
|
|||
mounted() {
|
||||
this.fetchNotes();
|
||||
this.initPolling();
|
||||
const parentElement = this.$el.parentElement;
|
||||
|
||||
if (this.$el.parentElement) {
|
||||
this.$el.parentElement.addEventListener('toggleAward', (event) => {
|
||||
if (parentElement &&
|
||||
parentElement.classList.contains('js-vue-notes-event')) {
|
||||
parentElement.addEventListener('toggleAward', (event) => {
|
||||
const { awardName, noteId } = event.detail;
|
||||
this.actionToggleAward({ awardName, noteId });
|
||||
});
|
||||
|
|
|
|||
|
|
@ -87,7 +87,7 @@ export const saveNote = ({ commit, dispatch }, noteData) => {
|
|||
const commandsChanges = res.commands_changes;
|
||||
|
||||
if (hasQuickActions && Object.keys(errors).length) {
|
||||
dispatch('poll');
|
||||
dispatch('fetchData');
|
||||
|
||||
$('.js-gfm-input').trigger('clear-commands-cache.atwho');
|
||||
Flash('Commands applied', 'notice', $(noteData.flashContainer));
|
||||
|
|
@ -186,6 +186,15 @@ export const poll = ({ commit, state, getters }) => {
|
|||
});
|
||||
};
|
||||
|
||||
export const fetchData = ({ commit, state, getters }) => {
|
||||
const requestData = { endpoint: state.notesData.notesPath, lastFetchedAt: state.lastFetchedAt };
|
||||
|
||||
service.poll(requestData)
|
||||
.then(resp => resp.json)
|
||||
.then(data => pollSuccessCallBack(data, commit, state, getters))
|
||||
.catch(() => Flash('Something went wrong while fetching latest comments.'));
|
||||
};
|
||||
|
||||
export const toggleAward = ({ commit, state, getters, dispatch }, { awardName, noteId }) => {
|
||||
commit(types.TOGGLE_AWARD, { awardName, note: getters.notesById[noteId] });
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,8 +1,10 @@
|
|||
import Vue from 'vue';
|
||||
import issueNotesApp from '~/notes/components/issue_notes_app.vue';
|
||||
import service from '~/notes/services/issue_notes_service';
|
||||
import { keyboardDownEvent } from '../../issue_show/helpers';
|
||||
import * as mockData from '../mock_data';
|
||||
|
||||
fdescribe('issue_note_app', () => {
|
||||
describe('issue_note_app', () => {
|
||||
let mountComponent;
|
||||
|
||||
beforeEach(() => {
|
||||
|
|
@ -52,7 +54,7 @@ fdescribe('issue_note_app', () => {
|
|||
});
|
||||
});
|
||||
|
||||
fdescribe('render', () => {
|
||||
describe('render', () => {
|
||||
let vm;
|
||||
|
||||
const responseInterceptor = (request, next) => {
|
||||
|
|
@ -73,8 +75,18 @@ fdescribe('issue_note_app', () => {
|
|||
afterEach(() => {
|
||||
Vue.http.interceptors = _.without(Vue.http.interceptors, responseInterceptor);
|
||||
});
|
||||
it('should render list of notes', () => {
|
||||
console.log(vm);
|
||||
|
||||
it('should render list of notes', (done) => {
|
||||
const note = mockData.discussionResponse[0].notes[0];
|
||||
|
||||
setTimeout(() => {
|
||||
expect(
|
||||
vm.$el.querySelector('.main-notes-list .note-header-author-name').textContent.trim(),
|
||||
).toEqual(note.author.name);
|
||||
|
||||
expect(vm.$el.querySelector('.main-notes-list .note-text').innerHTML).toEqual(note.note_html);
|
||||
done();
|
||||
}, 0);
|
||||
});
|
||||
|
||||
it('should render form', () => {
|
||||
|
|
@ -109,29 +121,44 @@ fdescribe('issue_note_app', () => {
|
|||
|
||||
describe('update note', () => {
|
||||
describe('individual note', () => {
|
||||
describe('shortup up key', () => {
|
||||
it('shows correct editing form when user clicks up', () => {
|
||||
});
|
||||
let vm;
|
||||
|
||||
const responseInterceptor = (request, next) => {
|
||||
next(request.respondWith(JSON.stringify(mockData.discussionResponse), {
|
||||
status: 200,
|
||||
}));
|
||||
};
|
||||
|
||||
beforeEach(() => {
|
||||
Vue.http.interceptors.push(responseInterceptor);
|
||||
|
||||
vm = mountComponent({
|
||||
issueData: mockData.issueDataMock,
|
||||
notesData: mockData.notesDataMock,
|
||||
userData: mockData.userDataMock,
|
||||
});
|
||||
|
||||
describe('dropdown', () => {
|
||||
it('renders edit form', () => {
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
Vue.http.interceptors = _.without(Vue.http.interceptors, responseInterceptor);
|
||||
});
|
||||
|
||||
it('renders edit form', () => {
|
||||
setTimeout(() => {
|
||||
vm.$el.querySelector('.js-note-edit').click();
|
||||
Vue.nextTick(() => {
|
||||
expect(vm.$el.querySelector('.js-vue-issue-note-form')).toBeDefined();
|
||||
});
|
||||
}, 0);
|
||||
});
|
||||
|
||||
it('updates the note and resets the edit form', () => {});
|
||||
});
|
||||
|
||||
describe('dicussion note note', () => {
|
||||
describe('shortup up key', () => {
|
||||
it('shows correct editing form when user clicks up', () => {
|
||||
});
|
||||
});
|
||||
|
||||
describe('dropdown', () => {
|
||||
it('renders edit form', () => {
|
||||
});
|
||||
});
|
||||
|
||||
it('updates the note and resets the edit form', () => {});
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in a new issue