Skip to content
This repository has been archived by the owner on Jun 26, 2020. It is now read-only.

Link balloon will not be shown if no link was added after command execution #226

Merged
merged 1 commit into from
May 21, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 19 additions & 3 deletions src/linkui.js
Original file line number Diff line number Diff line change
Expand Up @@ -154,17 +154,17 @@ export default class LinkUI extends Plugin {
// Execute link command after clicking the "Save" button.
this.listenTo( formView, 'submit', () => {
editor.execute( 'link', formView.urlInputView.inputView.element.value );
this._removeFormView();
this._closeFormView();
} );

// Hide the panel after clicking the "Cancel" button.
this.listenTo( formView, 'cancel', () => {
this._removeFormView();
this._closeFormView();
} );

// Close the panel on esc key press when the **form has focus**.
formView.keystrokes.set( 'Esc', ( data, cancel ) => {
this._removeFormView();
this._closeFormView();
cancel();
} );

Expand Down Expand Up @@ -306,6 +306,22 @@ export default class LinkUI extends Plugin {
this.formView.urlInputView.inputView.element.value = linkCommand.value || '';
}

/**
* Closes form view. Decides whether the balloon should be hidden completely or if action view should be shown. This is decided upon
* link command value (which has value if the document selection is in link).
*
* @private
*/
_closeFormView() {
const linkCommand = this.editor.commands.get( 'link' );

if ( linkCommand.value !== undefined ) {
this._removeFormView();
} else {
this._hideUI();
}
}

/**
* Removes the {@link #formView} from the {@link #_balloon}.
*
Expand Down
33 changes: 31 additions & 2 deletions tests/linkui.js
Original file line number Diff line number Diff line change
Expand Up @@ -812,15 +812,26 @@ describe( 'LinkUI', () => {
expect( focusEditableSpy.calledOnce ).to.be.true;
} );

it( 'should hide and reveal the #actionsView on formView#cancel event', () => {
it( 'should hide and reveal the #actionsView on formView#cancel event if link command has a value', () => {
linkUIFeature._showUI();

const command = editor.commands.get( 'link' );
command.value = 'http://foo.com';

formView.fire( 'cancel' );

expect( balloon.visibleView ).to.equal( actionsView );
expect( focusEditableSpy.calledOnce ).to.be.true;
} );

it( 'should hide after Esc key press', () => {
it( 'should hide the balloon on formView#cancel if link command does not have a value', () => {
linkUIFeature._showUI();
formView.fire( 'cancel' );

expect( balloon.visibleView ).to.be.null;
} );

it( 'should hide and reveal the #actionsView after Esc key press if link command has a value', () => {
const keyEvtData = {
keyCode: keyCodes.esc,
preventDefault: sinon.spy(),
Expand All @@ -829,11 +840,29 @@ describe( 'LinkUI', () => {

linkUIFeature._showUI();

const command = editor.commands.get( 'link' );
command.value = 'http://foo.com';

formView.keystrokes.press( keyEvtData );

expect( balloon.visibleView ).to.equal( actionsView );
expect( focusEditableSpy.calledOnce ).to.be.true;
} );

it( 'should hide the balloon after Esc key press if link command does not have a value', () => {
const keyEvtData = {
keyCode: keyCodes.esc,
preventDefault: sinon.spy(),
stopPropagation: sinon.spy()
};

linkUIFeature._showUI();

formView.keystrokes.press( keyEvtData );

expect( balloon.visibleView ).to.be.null;
} );

// https://github.com/ckeditor/ckeditor5/issues/1501
it( 'should blur url input element before hiding the view', () => {
linkUIFeature._showUI();
Expand Down