mediawiki-extensions-Cite/tests/qunit/ext.cite.referencePreviews/renderer.test.js
Jon Robson dcb513eb0e Move reference previews to Cite extension
The ext.cite.referencePreviews module will transparently replace the
ext.popups.referencePreviews module after this patch.  Configuration
stays in Popups for now, we can migrate it in later work.

CSS classes may be renamed in the future but this will be handled
separately since it could be a breaking change for on-wiki
customizations.

A lot of fancy footwork happens in this patch to emulate a soft
dependency on Popups.  This mechanism doesn't exist explicitly in
either ResourceLoader or QUnit, so lots of workarounds are used, to
conditionally load the module and to dynamically skip dependent tests.

renderer.test.js is fully skipped for now, but can be wired up in
later work.

Bug: T355194
Change-Id: I0dc47abb59a40d4e41e7dda0eb7b415a2e1ae508
2024-03-12 17:43:51 +01:00

110 lines
3.3 KiB
JavaScript

let createReferencePreview;
const previewTypes = { TYPE_REFERENCE: 'reference' };
// TODO: Fix this test. Currently failing on `document.getElementById`
QUnit.module.skip( 'ext.cite.referencePreviews#renderer', {
before() {
createReferencePreview = require( 'ext.cite.referencePreviews' ).private.createReferencePreview;
},
beforeEach() {
mw.msg = ( key ) => `<${ key }>`;
mw.message = ( key ) => {
return { exists: () => !key.endsWith( 'generic' ), text: () => `<${ key }>` };
};
mw.html = {
escape: ( str ) => str && str.replace( /'/g, '&apos;' ).replace( /</g, '&lt;' )
};
mw.track = () => {};
global.navigator = {
sendBeacon() {}
};
// Some tests below stub this function. Keep a copy so it can be restored.
this.getElementById = document.getElementById;
},
afterEach() {
// Restore getElementsById to its original state.
document.getElementById = this.getElementById;
mw.msg = null;
mw.message = null;
mw.html = null;
}
} );
QUnit.test( 'createReferencePreview(model)', ( assert ) => {
const model = {
url: '#custom_id',
extract: 'Custom <i>extract</i> with an <a href="/wiki/Internal">internal</a> and an <a href="//wikipedia.de" class="external">external</a> link',
type: previewTypes.TYPE_REFERENCE,
referenceType: 'web'
},
preview = createReferencePreview( model );
assert.strictEqual( preview.hasThumbnail, false );
assert.strictEqual( preview.isTall, false );
assert.strictEqual(
$( preview.el ).find( '.mwe-popups-title' ).text().trim(),
'<popups-refpreview-web>'
);
assert.strictEqual(
$( preview.el ).find( '.mw-parser-output' ).text().trim(),
'Custom extract with an internal and an external link'
);
assert.strictEqual(
$( preview.el ).find( 'a[target="_blank"]' ).length,
1,
'only external links open in new tabs'
);
} );
QUnit.test( 'createReferencePreview default title', ( assert ) => {
const model = {
url: '',
extract: '',
type: previewTypes.TYPE_REFERENCE
},
preview = createReferencePreview( model );
assert.strictEqual(
$( preview.el ).find( '.mwe-popups-title' ).text().trim(),
'<popups-refpreview-reference>'
);
} );
QUnit.test( 'createReferencePreview updates fade-out effect on scroll', ( assert ) => {
const model = {
url: '',
extract: '',
type: previewTypes.TYPE_REFERENCE
},
preview = createReferencePreview( model ),
$extract = $( preview.el ).find( '.mwe-popups-extract' );
$extract.children()[ 0 ].dispatchEvent( new Event( 'scroll' ) );
assert.false( $extract.children()[ 0 ].isScrolling );
assert.false( $extract.hasClass( 'mwe-popups-fade-out' ) );
} );
QUnit.test( 'createReferencePreview collapsible/sortable handling', ( assert ) => {
const model = {
url: '',
extract: '<table class="mw-collapsible"></table>' +
'<table class="sortable"><th class="headerSort" tabindex="1" title="Click here"></th></table>',
type: previewTypes.TYPE_REFERENCE
},
preview = createReferencePreview( model );
assert.strictEqual( $( preview.el ).find( '.mw-collapsible, .sortable, .headerSort' ).length, 0 );
assert.strictEqual( $( preview.el ).find( 'th' ).attr( 'tabindex' ), undefined );
assert.strictEqual( $( preview.el ).find( 'th' ).attr( 'title' ), undefined );
assert.strictEqual(
$( preview.el ).find( '.mwe-collapsible-placeholder' ).text(),
'<popups-refpreview-collapsible-placeholder>'
);
} );