Use jQuery.data in favour of jQuery.attr

Ref: https://api.jquery.com/data/

Change-Id: I4ce901a8b030c4864814b8bed14dc0049fd788d7
This commit is contained in:
Simon Legner 2024-05-15 20:28:43 +02:00
parent ff16f19a3f
commit 628979d317
6 changed files with 24 additions and 24 deletions

View file

@ -136,7 +136,7 @@ const { EmbedFileFormatter, Utils } = require( 'mmv.ui.ondemandshareddependencie
[ 'plain', 'html' ].forEach( ( name ) => $( '<button>' )
.addClass( 'cdx-tabs__list__item' )
.attr( 'role', 'tab' )
.attr( 'data-name', name )
.data( 'name', name )
// The following messages are used here:
// * multimediaviewer-attr-plain
// * multimediaviewer-attr-html
@ -166,7 +166,7 @@ const { EmbedFileFormatter, Utils } = require( 'mmv.ui.ondemandshareddependencie
this.$attributionTabsList.children().each( ( _i, element ) => {
const $element = $( element );
$element.attr( 'aria-selected', $element.attr( 'data-name' ) === name );
$element.attr( 'aria-selected', $element.data( 'name' ) === name );
} );
if ( this.currentAttrView === 'html' ) {
@ -199,9 +199,9 @@ const { EmbedFileFormatter, Utils } = require( 'mmv.ui.ondemandshareddependencie
// eslint-disable-next-line no-jquery/no-sizzle
const $option = this.$downloadSizeMenu.find( ':selected' );
const value = {
name: $option.attr( 'data-name' ),
width: $option.attr( 'data-width' ),
height: $option.attr( 'data-height' )
name: $option.data( 'name' ),
width: $option.data( 'width' ),
height: $option.data( 'height' )
};
if ( value.name === 'original' && this.image !== null ) {

View file

@ -84,7 +84,7 @@
options.forEach( ( size ) =>
$( '<option>' )
.attr( 'value', size )
.attr( 'data-name', size )
.data( 'name', size )
.text( this.getDimensionsMessageHtml( size ) )
.appendTo( $select )
);
@ -119,13 +119,13 @@
updateSelectOptions( sizes, options ) {
for ( let i = 0; i < options.length; i++ ) {
const $option = $( options[ i ] );
const name = $option.attr( 'data-name' );
const name = $option.data( 'name' );
if ( sizes[ name ] ) {
$option.prop( 'disabled', false );
// These values are later used when the item is selected
$option.attr( 'data-width', sizes[ name ].width );
$option.attr( 'data-height', sizes[ name ].height );
$option.data( 'width', sizes[ name ].width );
$option.data( 'height', sizes[ name ].height );
$option.text( this.getDimensionsMessageHtml( name, sizes[ name ].width, sizes[ name ].height ) );
} else {

View file

@ -89,7 +89,7 @@ const { UiElement } = require( 'mmv' );
[ 'wikitext', 'html' ].forEach( ( name ) => $( '<button>' )
.addClass( 'cdx-tabs__list__item' )
.attr( 'role', 'tab' )
.attr( 'data-name', name )
.data( 'name', name )
.text( mw.message( name === 'wikitext' ? 'multimediaviewer-embed-wt' : 'multimediaviewer-embed-html' ).text() )
.on( 'click', () => this.handleTypeSwitch( name ) )
.appendTo( this.$embedSwitchList )
@ -149,12 +149,12 @@ const { UiElement } = require( 'mmv' );
// eslint-disable-next-line no-jquery/no-sizzle
const $html = this.$embedSizeSwitchHtml.find( ':selected' );
if ( $html.length ) {
this.updateEmbedHtml( {}, $html.attr( 'data-width' ), $html.attr( 'data-height' ) );
this.updateEmbedHtml( {}, $html.data( 'width' ), $html.data( 'height' ) );
}
// eslint-disable-next-line no-jquery/no-sizzle
const $wikitext = this.$embedSizeSwitchWikitext.find( ':selected' );
if ( $wikitext.length ) {
this.updateEmbedWikitext( $wikitext.attr( 'data-width' ) );
this.updateEmbedWikitext( $wikitext.data( 'width' ) );
}
}
@ -166,7 +166,7 @@ const { UiElement } = require( 'mmv' );
handleTypeSwitch( value ) {
this.$embedSwitchList.children().each( ( _i, element ) => {
const $element = $( element );
$element.attr( 'aria-selected', $element.attr( 'data-name' ) === value );
$element.attr( 'aria-selected', $element.data( 'name' ) === value );
} );
this.$embedTextHtmlDiv.toggle( value === 'html' );

View file

@ -57,10 +57,10 @@ const { HtmlUtils } = require( 'mmv.bootstrap' );
const $el = $( '<span>' );
const el = $( '<span>' ).get( 0 );
HtmlUtils.wrapAndJquerify( $el ).find( 'span' ).prop( 'data-x', 1 );
HtmlUtils.wrapAndJquerify( el ).find( 'span' ).prop( 'data-x', 1 );
assert.strictEqual( $el.prop( 'data-x' ), undefined, 'wrapped jQuery element is not the same as original' );
assert.strictEqual( $( el ).prop( 'data-x' ), undefined, 'wrapped HTMLElement is not the same as original' );
HtmlUtils.wrapAndJquerify( $el ).find( 'span' ).data( 'x', 1 );
HtmlUtils.wrapAndJquerify( el ).find( 'span' ).data( 'x', 1 );
assert.strictEqual( $el.data( 'x' ), undefined, 'wrapped jQuery element is not the same as original' );
assert.strictEqual( $( el ).data( 'x' ), undefined, 'wrapped HTMLElement is not the same as original' );
} );
QUnit.test( 'filterInvisible()', function ( assert ) {

View file

@ -56,8 +56,8 @@ const { Embed } = require( 'mmv.ui.reuse.shareembed' );
const height = '20';
const $option = embed.$embedSizeSwitchHtml.children().first();
$option.attr( 'data-width', width );
$option.attr( 'data-height', height );
$option.data( 'width', width );
$option.data( 'height', height );
embed.$embedSizeSwitchHtml.val( $option.val() );
embed.updateEmbedHtml = function ( thumb, w, h ) {
@ -81,8 +81,8 @@ const { Embed } = require( 'mmv.ui.reuse.shareembed' );
const height = '20';
const $option = embed.$embedSizeSwitchWikitext.children().first();
$option.attr( 'data-width', width );
$option.attr( 'data-height', height );
$option.data( 'width', width );
$option.data( 'height', height );
embed.$embedSizeSwitchWikitext.val( $option.val() );
embed.updateEmbedHtml = function () {

View file

@ -41,9 +41,9 @@ const { Utils } = require( 'mmv.ui.ondemandshareddependencies' );
for ( let i = 0; i < menuItems.length; i++ ) {
const $option = $( $options[ i ] );
assert.strictEqual( $option.attr( 'data-name' ), menuItems[ i ], 'Correct item name on the list.' );
assert.strictEqual( $option.attr( 'data-height' ), undefined, 'Correct item height on the list.' );
assert.strictEqual( $option.attr( 'data-width' ), undefined, 'Correct item width on the list.' );
assert.strictEqual( $option.data( 'name' ), menuItems[ i ], 'Correct item name on the list.' );
assert.strictEqual( $option.data( 'height' ), undefined, 'Correct item height on the list.' );
assert.strictEqual( $option.data( 'width' ), undefined, 'Correct item width on the list.' );
}
} );