mediawiki-extensions-WikiEd.../tests/qunit/ext.wikiEditor.toolbar.test.js
Alexander Jones 55c6e1271f Add QUnit test for ext.wikiEditor.toolbar
This patch replaces the manually operated test module for ext.wikiEditor.toolbar
with one based on QUnit. The new test suite uncovered a bug with the removeFromToolbar
API function in jquery.wikiEditor.toolbar, which prevented the removal of select buttons
from the toolbar. This issue has also been fixed in this commit. .jshintrc was updated
to ignore the new QUnit global.

Bug: T39485
Change-Id: Icef3debcffa484a8d78628bcd9da0892b750bb40
2014-11-29 14:12:26 -06:00

275 lines
9 KiB
JavaScript

( function ( $ ) {
QUnit.module( 'ext.wikiEditor.toolbar', QUnit.newMwEnvironment( {
setup: function () {
var $fixture = $( '#qunit-fixture' );
var $target = $( '<textarea id="wpTextBox1">' );
this.$target = $target;
$fixture.append( $target );
$target.wikiEditor( 'addModule', 'toolbar' );
this.$ui = $target.data( 'wikiEditor-context' ).$ui;
}
} ) );
QUnit.test( 'Toolbars', 16, function ( assert ) {
// Add toolbar section
var data = {
sections: {
emoticons: {
type: 'toolbar',
label: 'Emoticons'
}
}
};
assert.equal( this.$ui.find( '*[rel="emoticons"].section' ).length, 0, 'Before adding toolbar section' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.equal( this.$ui.find( '*[rel="emoticons"].section' ).length, 1, 'After adding toolbar section' );
// Add toolbar group
data = {
section: 'emoticons',
groups: {
faces: {
label: 'Faces'
}
}
};
assert.equal( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group' ).length, 0, 'Before adding toolbar group' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.equal( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group' ).length, 1, 'After adding toolbar group' );
// Add button tool
data = {
section: 'emoticons',
group: 'faces',
tools: {
smile: {
label: 'Smile!',
type: 'button',
icon: 'http://upload.wikimedia.org/wikipedia/commons/thumb/a/a4/Gnome-face-smile.svg/22px-Gnome-face-smile.svg.png',
action: {
type: 'encapsulate',
options: {
pre: ':)'
}
}
}
}
};
assert.equal( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group *[rel="smile"].tool' ).length, 0, 'Before adding button' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.equal( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group *[rel="smile"].tool' ).length, 1, 'After adding button' );
// Remove button tool
data = {
section: 'emoticons',
group: 'faces',
tool: 'smile'
};
assert.equal( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group *[rel="smile"].tool' ).length, 1, 'Before removing button' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.equal( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group *[rel="smile"].tool' ).length, 0, 'After removing button' );
// Add select tool
data = {
section: 'emoticons',
group: 'faces',
tools: {
icons: {
label: 'Icons',
type: 'select',
list: {
wink : {
label: 'Wink',
action: {
type: 'encapsulate',
options: {
pre: ';)'
}
}
},
frown : {
label: 'Frown',
action: {
type: 'encapsulate',
options: {
pre: ':('
}
}
},
bigSmile : {
label: 'Big smile',
action: {
type: 'encapsulate',
options: {
pre: ':D'
}
}
}
}
}
}
};
assert.equal( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group *[rel="icons"].tool' ).length, 0, 'Before adding select' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.equal( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group *[rel="icons"].tool' ).length, 1, 'After adding select' );
// Remove select tool
data = {
section: 'emoticons',
group: 'faces',
tool: 'icons'
};
assert.equal( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group *[rel="icons"].tool' ).length, 1, 'Before removing select' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.equal( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group *[rel="icons"].tool' ).length, 0, 'After removing select' );
// Remove toolbar group
data = {
section: 'emoticons',
group: 'faces'
};
assert.equal( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group' ).length, 1, 'Before removing toolbar group' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.equal( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group' ).length, 0, 'After removing toolbar group' );
// Remove toolbar section
data = {
section: 'emoticons'
};
assert.equal( this.$ui.find( '*[rel="emoticons"].section' ).length, 1, 'Before removing toolbar section' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.equal( this.$ui.find( '*[rel="emoticons"].section' ).length, 0, 'After removing toolbar section' );
} );
QUnit.test( 'Booklets', 20, function ( assert ) {
// Add booklet section
var data = {
sections: {
info: {
type: 'booklet',
label: 'Info'
}
}
};
assert.equal( this.$ui.find( '*[rel="info"].section' ).length, 0, 'Before adding booklet section' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.equal( this.$ui.find( '*[rel="info"].section' ).length, 1, 'After adding booklet section' );
// Add table page
data = {
section: 'info',
pages: {
colors: {
layout: 'table',
label: 'Colors',
headings: [
{ text: 'Name' },
{ text: 'Temperature' },
{ text: 'Swatch' }
]
}
}
};
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="colors"].page' ).length, 0, 'Before adding table page' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="colors"].page' ).length, 1, 'After adding table page' );
// Add table rows
data = {
section: 'info',
page: 'colors',
rows: [
{
name: { text: 'Red' },
temp: { text: 'Warm' },
swatch: { html: '<div style="width: 10px; height: 10px; background-color: red;">' }
},
{
name: { text: 'Blue' },
temp: { text: 'Cold' },
swatch: { html: '<div style="width: 10px; height: 10px; background-color: blue;">' }
},
{
name: { text: 'Silver' },
temp: { text: 'Neutral' },
swatch: { html: '<div style="width: 10px; height: 10px; background-color: silver;">' }
}
]
};
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="colors"].page tr td' ).length, 0, 'Before adding table rows' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="colors"].page tr td' ).length, 9, 'After adding table rows' );
// Remove table row
data = {
section: 'info',
page: 'colors',
row: 0
};
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="colors"].page tr td' ).length, 9, 'Before removing table row' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="colors"].page tr td' ).length, 6, 'After removing table row' );
// Remove table page
data = {
section: 'info',
page: 'colors'
};
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="colors"].page' ).length, 1, 'Before removing table page' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="colors"].page' ).length, 0, 'After removing table page' );
// Add character page
data = {
section: 'info',
pages: {
emoticons: {
layout: 'characters',
label: 'Emoticons'
}
}
};
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page' ).length, 0, 'Before adding character page' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page' ).length, 1, 'After adding character page' );
// Add characters
data = {
section: 'info',
page: 'emoticons',
characters: [ ':)', ':))', ':(', '<3', ';)' ]
};
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page *[rel=":))"]' ).length, 0, 'Before adding characters' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page *[rel=":))"]' ).length, 1, 'After adding characters' );
// Remove character
data = {
section: 'info',
page: 'emoticons',
character: ':))'
};
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page *[rel=":))"]' ).length, 1, 'Before removing character' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page *[rel=":))"]' ).length, 0, 'After removing character' );
// Remove character page
data = {
section: 'info',
page: 'emoticons'
};
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page' ).length, 1, 'Before removing character page' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.equal( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page' ).length, 0, 'After removing character page' );
// Remove booklet section
data = {
section: 'info'
};
assert.equal( this.$ui.find( '*[rel="info"].section' ).length, 1, 'Before removing booklet section' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.equal( this.$ui.find( '*[rel="info"].section' ).length, 0, 'After removing booklet section' );
} );
}( jQuery ) );