Shawn Erquhart 18c579d0e9 feat: Code Widget + Markdown Widget Internal Overhaul (#2828)
* wip - upgrade to slate 0.43

* wip

* wip

* wip

* wip

* wip

* wip

* wip

* finish list handling logic

* add plugins directory

* tests wip

* setup testing

* wip

* add selection commands

* finish list testing

* stuff

* add codemirror

* abstract codemirror from slate

* wip

* wip

* wip

* wip

* wip

* wip

* wip

* wip

* wip

* codemirror mostly working, some bugs

* upgrade to slate 46

* upgrade to slate 47

* wip

* wip

* progress

* wip

* mostly working links with surrounding marks

* wip

* tests passing

* add test

* fix formatting

* update snapshots

* close self closing tag in markdown html output

* wip - commonmark

* hold on commonmark work

* all tests passing

* fix e2e specs

* ignore tests in esm builds

* break/backspace plugins wip

* finish enter/backspace spec

* fix soft break handling

* wip - editor component deletion

* add insertion points

* make insertion points invisible

* fix empty mark nodes output to markdown

* fix pasting

* improve insertion points

* add static bottom insertion point

* improve click handling at insertion points

* restore current table functionality

* add paste support for Slate fragments

* support cut/copy markdown, paste between rich/raw editor

* fix copy paste

* wip - paste/select bug fixing

* fixed known slate issues

* split plugins

* fix editor toggles

* force text cursor in code widget

* wip - reorg plugins

* finish markdown control reorg

* configure plugin types

* quote block adjacent handling with tests

* wip

* finish quote logic and tests

* fix copy paste plugin migration regressions

* fix force insert before node

* fix trailing insertion point

* remove empty headers

* codemirror working properly in markdown widget

* return focus to codemirror on lang select enter

* fix state issues for widgets with local state

* wip - vim working, just need to work out distribution

* add settings pane

* wip - default modes

* fix deps

* add programming language data

* implement linguist langs in code widget

* everything built in

* remove old registration code, fix focus styling

* fix/update linting setup

* fix js lint errors

* remove stylelint from format script

* fix remaining linting errors

* fix reducer test failures

* chore: update commitlint for worktree support

* chore: fix remaining tests

* chore: drop unused monaco plugin

* chore: remove extraneous global styles rendering

* chore: fix failing tests

* fix: tests

* fix: quote/list nesting (tests still broken)

* fix: update quote tests

* chore: bring back code widget test config

* fix: autofocus

* fix: code blocks without the code widget

* fix: code editor component state issues

* fix: error

* fix: add code block test, few fixes

* chore: remove notes

* fix: [wip] update stateful shortcodes on undo/redo

* fix: support code styled links, handle unknown langs

* fix: few fixes

* fix: autofocus on insert, focus on all clicks

* fix: linting

* fix: autofocus

* fix: update code block fixture

* fix: remove unused cypress snapshot plugin

* fix: drop node 8 test, add node 12

* fix: use lodash.flatten instead of Array.flat

* fix: remove console logs
2019-12-16 19:17:37 +02:00

337 lines
8.7 KiB
JavaScript

const { notifications, workflowStatus, editorStatus, publishTypes } = require('./constants');
function login(user) {
cy.viewport(1200, 1200);
if (user) {
cy.visit('/', {
onBeforeLoad: () => {
// https://github.com/cypress-io/cypress/issues/1208
window.indexedDB.deleteDatabase('localforage');
window.localStorage.setItem('netlify-cms-user', JSON.stringify(user));
},
});
} else {
cy.visit('/');
cy.contains('button', 'Login').click();
}
cy.contains('a', 'New Post');
}
function assertNotification(message) {
if (Array.isArray(message)) {
console.log(message);
const messages = message.reverse();
cy.get('.notif__container div')
.should('have.length.of', messages.length)
.each((el, idx) => {
cy.wrap(el)
.contains(messages[idx])
.invoke('hide');
});
} else {
cy.get('.notif__container').within(() => {
cy.contains(message).invoke('hide');
});
}
}
function exitEditor() {
cy.contains('a[href^="#/collections/"]', 'Writing in').click();
}
function goToWorkflow() {
cy.contains('a', 'Workflow').click();
}
function goToCollections() {
cy.contains('a', 'Content').click();
}
function updateWorkflowStatus({ title }, fromColumnHeading, toColumnHeading) {
cy.contains('h2', fromColumnHeading)
.parent()
.contains('a', title)
.drag();
cy.contains('h2', toColumnHeading)
.parent()
.drop();
assertNotification(notifications.updated);
}
function publishWorkflowEntry({ title }) {
cy.contains('h2', workflowStatus.ready)
.parent()
.within(() => {
cy.contains('a', title)
.parent()
.within(() => {
cy.contains('button', 'Publish new entry').click({ force: true });
});
});
assertNotification(notifications.published);
}
function deleteWorkflowEntry({ title }) {
cy.contains('a', title)
.parent()
.within(() => {
cy.contains('button', 'Delete new entry').click({ force: true });
});
assertNotification(notifications.deletedUnpublished);
}
function assertWorkflowStatusInEditor(status) {
cy.contains('[role="button"]', 'Set status').as('setStatusButton');
cy.get('@setStatusButton')
.parent()
.within(() => {
cy.get('@setStatusButton').click();
cy.contains('[role="menuitem"] span', status)
.parent()
.within(() => {
cy.get('svg');
});
cy.get('@setStatusButton').click();
});
}
function assertPublishedEntry(entry) {
if (Array.isArray(entry)) {
const entries = entry.reverse();
cy.get('a h2').then(els => {
cy.wrap(els.slice(0, entries.length)).each((el, idx) => {
cy.wrap(el).contains(entries[idx].title);
});
});
} else {
cy.get('a h2')
.first()
.contains(entry.title);
}
}
function deleteEntryInEditor() {
cy.contains('button', 'Delete').click();
assertNotification(notifications.deletedUnpublished);
}
function assertOnCollectionsPage() {
cy.url().should('contain', '/#/collections/posts');
cy.contains('h2', 'Collections');
}
function assertEntryDeleted(entry) {
if (Array.isArray(entry)) {
const titles = entry.map(e => e.title);
cy.get('a h2').each(el => {
expect(titles).not.to.include(el.text());
});
} else {
cy.get('a h2').each(el => {
expect(entry.title).not.to.equal(el.text());
});
}
}
function assertWorkflowStatus({ title }, status) {
cy.contains('h2', status)
.parent()
.contains('a', title);
}
function updateWorkflowStatusInEditor(newStatus) {
selectDropdownItem('Set status', newStatus);
assertNotification(notifications.updated);
}
function publishEntryInEditor(publishType) {
selectDropdownItem('Publish', publishType);
assertNotification(notifications.published);
}
function selectDropdownItem(label, item){
cy.contains('[role="button"]', label).as('dropDownButton');
cy.get('@dropDownButton')
.parent()
.within(() => {
cy.get('@dropDownButton').click();
cy.contains('[role="menuitem"] span', item).click();
});
}
function populateEntry(entry) {
const keys = Object.keys(entry);
for (let key of keys) {
const value = entry[key];
if (key === 'body') {
cy.getMarkdownEditor()
.click()
.clear()
.type(value);
} else {
cy.get(`[id^="${key}-field"]`)
.clear()
.type(value);
}
}
cy.clock().then(clock => {
// some input fields are de-bounced thus require advancing the clock
if (clock) {
// https://github.com/cypress-io/cypress/issues/1273
clock.tick(150);
clock.tick(150);
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(500);
}
cy.get('input')
.first()
.click();
cy.contains('button', 'Save').click();
assertNotification(notifications.saved);
});
}
function createPost(entry) {
cy.contains('a', 'New Post').click();
populateEntry(entry);
}
function createPostAndExit(entry) {
createPost(entry);
exitEditor();
}
function updateExistingPostAndExit(fromEntry, toEntry) {
goToWorkflow();
cy.contains('h2', fromEntry.title)
.parent()
.click({ force: true });
populateEntry(toEntry);
exitEditor();
goToWorkflow();
cy.contains('h2', toEntry.title);
}
function unpublishEntry(entry) {
goToCollections();
cy.contains('h2', entry.title)
.parent()
.click({ force: true });
selectDropdownItem('Published', 'Unpublish');
assertNotification(notifications.unpublished);
goToWorkflow();
assertWorkflowStatus(entry, workflowStatus.ready);
}
function duplicateEntry(entry) {
selectDropdownItem('Published', 'Duplicate');
cy.url().should('contain', '/#/collections/posts/new');
cy.contains('button', 'Save').click();
updateWorkflowStatusInEditor(editorStatus.ready);
publishEntryInEditor(publishTypes.publishNow);
exitEditor();
cy.get('a h2').should(($h2s) => {
expect($h2s.eq(0)).to.contain(entry.title);
expect($h2s.eq(1)).to.contain(entry.title);
});
}
function validateObjectFields({ limit, author }) {
cy.get('a[href^="#/collections/settings"]').click();
cy.get('a[href^="#/collections/settings/entries/general"]').click();
cy.get('input[type=number]').type(limit);
cy.contains('button', 'Save').click();
assertNotification(notifications.error.missingField);
cy.contains('label', 'Default Author').click();
cy.focused().type(author);
cy.contains('button', 'Save').click();
assertNotification(notifications.saved);
}
function validateNestedObjectFields({ limit, author }) {
cy.get('a[href^="#/collections/settings"]').click();
cy.get('a[href^="#/collections/settings/entries/general"]').click();
cy.contains('label', 'Default Author').click();
cy.focused().type(author);
cy.contains('button', 'Save').click();
assertNotification(notifications.error.missingField);
cy.get('input[type=number]').type(limit + 1);
cy.contains('button', 'Save').click();
assertFieldValidationError(notifications.validation.range);
cy.get('input[type=number]')
.clear()
.type(-1);
cy.contains('button', 'Save').click();
assertFieldValidationError(notifications.validation.range);
cy.get('input[type=number]')
.clear()
.type(limit);
cy.contains('button', 'Save').click();
assertNotification(notifications.saved);
}
function validateListFields({ name, description }) {
cy.get('a[href^="#/collections/settings"]').click();
cy.get('a[href^="#/collections/settings/entries/authors"]').click();
cy.contains('button', 'Add').click();
cy.contains('button', 'Save').click();
assertNotification(notifications.error.missingField);
cy.get('input')
.eq(2)
.type(name);
cy.getMarkdownEditor()
.eq(2)
.type(description);
cy.contains('button', 'Save').click();
}
function validateObjectFieldsAndExit(setting) {
validateObjectFields(setting);
exitEditor();
}
function validateNestedObjectFieldsAndExit(setting) {
validateNestedObjectFields(setting);
exitEditor();
}
function validateListFieldsAndExit(setting) {
validateListFields(setting);
exitEditor();
}
function assertFieldValidationError({ message, fieldLabel }) {
cy.contains('label', fieldLabel)
.siblings('ul[class*=ControlErrorsList]')
.contains(message);
}
module.exports = {
login,
createPost,
createPostAndExit,
updateExistingPostAndExit,
exitEditor,
goToWorkflow,
goToCollections,
updateWorkflowStatus,
publishWorkflowEntry,
deleteWorkflowEntry,
assertWorkflowStatusInEditor,
assertPublishedEntry,
deleteEntryInEditor,
assertOnCollectionsPage,
assertEntryDeleted,
assertWorkflowStatus,
updateWorkflowStatusInEditor,
validateObjectFieldsAndExit,
validateNestedObjectFieldsAndExit,
validateListFieldsAndExit,
unpublishEntry,
publishEntryInEditor,
duplicateEntry,
};