@atlaskit/editor-common
Version:
A package that contains common classes and components for editor and renderer
143 lines • 4.43 kB
JavaScript
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import { InProductTestPageObject } from '@atlaskit/in-product-testing';
import { BlockCardPageObject, EmbedCardPageObject, InlineCardPageObject } from '@atlaskit/smart-card/in-product';
export class EditorSmartLinkPageObject extends InProductTestPageObject {
constructor(cy, editor) {
super(cy);
_defineProperty(this, "testIds", {
viewSwitcher: 'link-toolbar-appearance-button',
displayUrlOption: 'url-appearance',
displayInlineOption: 'inline-appearance',
displayCardOption: 'block-appearance',
displayEmbedOption: 'embed-appearance',
linkUrl: 'link-url',
linkLabel: 'link-text'
});
_defineProperty(this, "ariaLabels", {
editLink: 'Edit link',
deleteLink: 'Remove',
unlinkLink: 'Unlink'
});
this.cy = cy;
this.editor = editor;
}
getViewSwitcher() {
return this.cy.get(this.toTestId(this.testIds.viewSwitcher));
}
openViewSwitcher() {
return this.getViewSwitcher().click();
}
getViewSwitcherOption(type = 'inline') {
switch (type) {
case 'url':
{
return this.cy.get(this.toTestId(this.testIds.displayUrlOption));
}
case 'inline':
{
return this.cy.get(this.toTestId(this.testIds.displayInlineOption));
}
case 'block':
{
return this.cy.get(this.toTestId(this.testIds.displayCardOption));
}
case 'embed':
{
return this.cy.get(this.toTestId(this.testIds.displayEmbedOption));
}
default:
{
throw Error(`Attempted to switch to \`${type}\`: unknown Smart Link view switcher option!`);
}
}
}
selectViewSwitcherOption(type = 'inline') {
const viewSwitcherOption = this.getViewSwitcherOption(type);
return viewSwitcherOption.click();
}
insertSmartLinkByTyping(url) {
return this.editor.getEditorArea().type(`${url} `, {
delay: 0
}).get('p>a').type('{leftArrow}{leftArrow}').get('[aria-label="Floating Toolbar"]').then(() => {
this.openViewSwitcher();
this.selectViewSwitcherOption('inline');
});
}
switchAfterInsert(type = 'inline') {
// NOTE: inline inserted by default for all Smart Links.
const inlineCard = new InlineCardPageObject(this.cy);
inlineCard.click();
this.openViewSwitcher();
this.selectViewSwitcherOption(type);
}
getSmartLink(type = 'inline') {
switch (type) {
case 'inline':
{
return new InlineCardPageObject(this.cy);
}
case 'block':
{
return new BlockCardPageObject(this.cy);
}
case 'embed':
{
return new EmbedCardPageObject(this.cy);
}
case 'url':
{
return new InlineCardPageObject(this.cy);
}
}
}
getEditLinkButton() {
return this.cy.get(this.toAriaLabel(this.ariaLabels.editLink));
}
openEditLinkMenu() {
const button = this.getEditLinkButton();
return button.click();
}
changeLinkLabel(title, type = 'inline') {
const smartLink = this.getSmartLink(type);
smartLink.click();
this.openEditLinkMenu();
this.typeIntoLabelField(title);
}
changeLinkUrl(url, type = 'inline') {
this.getSmartLink(type).click();
this.openEditLinkMenu();
this.typeIntoUrlField(url);
}
typeIntoLabelField(title) {
const titleField = this.cy.get(this.toTestId(this.testIds.linkLabel)).focus();
titleField.clear();
titleField.type(`${title}{enter}`, {
delay: 0
});
}
typeIntoUrlField(url) {
const urlField = this.cy.get(this.toTestId(this.testIds.linkUrl)).focus();
urlField.clear();
urlField.type(`${url}{enter}`, {
delay: 0
});
}
deleteSmartLink(type = 'inline') {
this.getSmartLink(type).click();
this.clickDeleteIcon();
}
clickDeleteIcon() {
const ariaLabelSelector = this.toAriaLabel(this.ariaLabels.deleteLink);
const deleteButtonSelector = `button${ariaLabelSelector}`;
return this.cy.get(deleteButtonSelector).click();
}
unlink(type = 'inline') {
this.getSmartLink(type).click();
this.clickUnlinkIcon();
}
clickUnlinkIcon() {
const ariaLabelSelector = this.toAriaLabel(this.ariaLabels.unlinkLink);
const unlinkButtonSelector = `button${ariaLabelSelector}`;
return this.cy.get(unlinkButtonSelector).click();
}
}