mediawiki-extensions-WikiEd.../tests/qunit/ext.wikiEditor.toolbar.test.js
Timo Tijhof 17fec690b0 tests: Remove use of QUnit 1.x setup()/teardown()
No longer supported upstream. Was kept compatible via MW core
testrunner.js, which I'd like to phase out so that our custom wrapper
can be removed, and thus other features like `QUnit.module.skip()`
become available.

While at it, also convert the file from an ad-hoc closure to using
the QUnit.module() scope and hooks object, as per
<https://api.qunitjs.com/QUnit/module/>.

Bug: T250045
Change-Id: I8c04c56cf5eec3f19ef12a803a192cd824b82f81
2022-05-03 01:22:12 +02:00

286 lines
9.5 KiB
JavaScript

QUnit.module( 'ext.wikiEditor.toolbar', function ( hooks ) {
hooks.beforeEach( function () {
var $target = $( '<textarea>' )
.attr( 'id', 'wpTextBox1' )
.appendTo( '#qunit-fixture' );
this.$target = $target;
$target.wikiEditor( 'addModule', 'toolbar' );
this.$ui = $target.data( 'wikiEditor-context' ).$ui;
} );
QUnit.test( 'Toolbars', function ( assert ) {
// Add toolbar section
var data = {
sections: {
emoticons: {
type: 'toolbar',
label: 'Emoticons'
}
}
};
assert.strictEqual( this.$ui.find( '*[rel="emoticons"].section' ).length, 0, 'Before adding toolbar section' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.strictEqual( this.$ui.find( '*[rel="emoticons"].section' ).length, 1, 'After adding toolbar section' );
// Add toolbar group
data = {
section: 'emoticons',
groups: {
faces: {
label: 'Faces'
}
}
};
assert.strictEqual( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group' ).length, 0, 'Before adding toolbar group' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.strictEqual( 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.strictEqual( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group *[rel="smile"].tool' ).length, 0, 'Before adding button' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.strictEqual( 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.strictEqual( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group *[rel="smile"].tool' ).length, 1, 'Before removing button' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.strictEqual( 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.strictEqual( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group *[rel="icons"].tool' ).length, 0, 'Before adding select' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.strictEqual( 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.strictEqual( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group *[rel="icons"].tool' ).length, 1, 'Before removing select' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.strictEqual( 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.strictEqual( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group' ).length, 1, 'Before removing toolbar group' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.strictEqual( this.$ui.find( '*[rel="emoticons"].section *[rel="faces"].group' ).length, 0, 'After removing toolbar group' );
// Remove toolbar section
data = {
section: 'emoticons'
};
assert.strictEqual( this.$ui.find( '*[rel="emoticons"].section' ).length, 1, 'Before removing toolbar section' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.strictEqual( this.$ui.find( '*[rel="emoticons"].section' ).length, 0, 'After removing toolbar section' );
} );
QUnit.test( 'Booklets', function ( assert ) {
// Add booklet section
var data = {
sections: {
info: {
type: 'booklet',
label: 'Info'
}
}
};
assert.strictEqual( this.$ui.find( '*[rel="info"].section' ).length, 0, 'Before adding booklet section' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.strictEqual( 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.strictEqual( this.$ui.find( '*[rel="info"].section *[rel="colors"].page' ).length, 0, 'Before adding table page' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.strictEqual( 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.strictEqual( this.$ui.find( '*[rel="info"].section *[rel="colors"].page tr td' ).length, 0, 'Before adding table rows' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.strictEqual( 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.strictEqual( this.$ui.find( '*[rel="info"].section *[rel="colors"].page tr td' ).length, 9, 'Before removing table row' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.strictEqual( 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.strictEqual( this.$ui.find( '*[rel="info"].section *[rel="colors"].page' ).length, 1, 'Before removing table page' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.strictEqual( 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.strictEqual( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page' ).length, 0, 'Before adding character page' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.strictEqual( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page' ).length, 1, 'After adding character page' );
// Add characters
data = {
section: 'info',
page: 'emoticons',
characters: [
':)', ':))', ':(', '<3', ';)',
{
label: ':-s',
title: 'unsure-face',
action: {
type: 'replace',
options: {
peri: ':-s',
selectPeri: false
}
}
} ]
};
assert.strictEqual( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page *[rel=":))"]' ).length, 0, 'Before adding characters' );
this.$target.wikiEditor( 'addToToolbar', data );
assert.strictEqual( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page *[rel=":))"]' ).length, 1, 'After adding characters' );
assert.strictEqual( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page *[title="unsure-face"]' ).length, 1, 'After adding characters find the set title' );
// Remove character
data = {
section: 'info',
page: 'emoticons',
character: ':))'
};
assert.strictEqual( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page *[rel=":))"]' ).length, 1, 'Before removing character' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.strictEqual( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page *[rel=":))"]' ).length, 0, 'After removing character' );
// Remove character page
data = {
section: 'info',
page: 'emoticons'
};
assert.strictEqual( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page' ).length, 1, 'Before removing character page' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.strictEqual( this.$ui.find( '*[rel="info"].section *[rel="emoticons"].page' ).length, 0, 'After removing character page' );
// Remove booklet section
data = {
section: 'info'
};
assert.strictEqual( this.$ui.find( '*[rel="info"].section' ).length, 1, 'Before removing booklet section' );
this.$target.wikiEditor( 'removeFromToolbar', data );
assert.strictEqual( this.$ui.find( '*[rel="info"].section' ).length, 0, 'After removing booklet section' );
} );
} );