Avoid HTML string parsing

Identified using https://github.com/wikimedia/eslint-plugin-jquery/pull/12

Change-Id: Ic3ac53804085aa61be54793e7e5f27b23d99a560

diff --git a/resources/src/jquery/jquery.makeCollapsible.js b/resources/src/jquery/jquery.makeCollapsible.js
index 43b8f0d..09306f6 100644 (file)
--- a/resources/src/jquery/jquery.makeCollapsible.js
+++ b/resources/src/jquery/jquery.makeCollapsible.js
@@ -218,7 +218,8 @@
 
                        // Default toggle link. Only build it when needed to avoid jQuery memory leaks (event data).
                        buildDefaultToggleLink = function () {
-                               return $( '<a class="mw-collapsible-text"></a>' )
+                               return $( '<a>' )
+                                       .addClass( 'mw-collapsible-text' )
                                        .text( collapseText )
                                        .wrap( '<span class="mw-collapsible-toggle mw-collapsible-toggle-default"></span>' )
                                        .parent()

diff --git a/resources/src/mediawiki.action/mediawiki.action.view.metadata.js b/resources/src/mediawiki.action/mediawiki.action.view.metadata.js
index e76ea33..b61349b 100644 (file)
--- a/resources/src/mediawiki.action/mediawiki.action.view.metadata.js
+++ b/resources/src/mediawiki.action/mediawiki.action.view.metadata.js
@@ -42,8 +42,8 @@
                                } );
 
                        $table.find( 'tbody' ).append(
-                               $( '<tr class="mw-metadata-show-hide-extended"></tr>' ).append(
-                                       $( '<td colspan="2"></td>' ).append( $link )
+                               $( '<tr>' ).addClass( 'mw-metadata-show-hide-extended' ).append(
+                                       $( '<td>' ).prop( 'colspan', 2 ).append( $link )
                                )
                        );
                } );

diff --git a/resources/src/mediawiki.debug/debug.js b/resources/src/mediawiki.debug/debug.js
index f0c2601..f1e829c 100644 (file)
--- a/resources/src/mediawiki.debug/debug.js
+++ b/resources/src/mediawiki.debug/debug.js
@@ -112,9 +112,15 @@
                buildHtml: function () {
                        var $container, $bits, panes, id, gitInfo;
 
-                       $container = $( '<div id="mw-debug-toolbar" class="mw-debug" lang="en" dir="ltr"></div>' );
+                       $container = $( '<div>' )
+                               .attr( {
+                                       id: 'mw-debug-toolbar',
+                                       lang: 'en',
+                                       dir: 'ltr'
+                               } )
+                               .addClass( 'mw-debug' );
 
-                       $bits = $( '<div class="mw-debug-bits"></div>' );
+                       $bits = $( '<div>' ).addClass( 'mw-debug-bits' );
 
                        /**
                         * Returns a jQuery element for a debug-bit div
@@ -189,7 +195,7 @@
                        }
 
                        bitDiv( 'mwversion' )
-                               .append( $( '<a href="//www.mediawiki.org/">MediaWiki</a>' ) )
+                               .append( $( '<a>' ).attr( 'href', '//www.mediawiki.org/' ).text( 'MediaWiki' ) )
                                .append( document.createTextNode( ': ' + this.data.mwVersion + ' ' ) )
                                .append( gitInfo );
 
@@ -198,10 +204,10 @@
                        }
 
                        bitDiv( 'phpversion' )
-                               .append( $( this.data.phpEngine === 'HHVM' ?
-                                       '<a href="https://hhvm.com/">HHVM</a>' :
-                                       '<a href="https://php.net/">PHP</a>'
-                               ) )
+                               .append( this.data.phpEngine === 'HHVM' ?
+                                       $( '<a>' ).attr( 'href', 'https://hhvm.com/' ).text( 'HHVM' ) :
+                                       $( '<a>' ).attr( 'href', 'https://php.net/' ).text( 'PHP' )
+                               )
                                .append( ': ' + this.data.phpVersion );
 
                        bitDiv( 'time' )
@@ -241,7 +247,7 @@
                buildConsoleTable: function () {
                        var $table, entryTypeText, i, length, entry;
 
-                       $table = $( '<table id="mw-debug-console">' );
+                       $table = $( '<table>' ).attr( 'id', 'mw-debug-console' );
 
                        $( '<colgroup>' ).css( 'width', /* padding = */ 20 + ( 10 * /* fontSize = */ 11 ) ).appendTo( $table );
                        $( '<colgroup>' ).appendTo( $table );
@@ -285,13 +291,13 @@
                buildQueryTable: function () {
                        var $table, i, length, query;
 
-                       $table = $( '<table id="mw-debug-querylist"></table>' );
+                       $table = $( '<table>' ).attr( 'id', 'mw-debug-querylist' );
 
                        $( '<tr>' )
-                               .append( $( '<th>#</th>' ).css( 'width', '4em' ) )
-                               .append( $( '<th>SQL</th>' ) )
-                               .append( $( '<th>Time</th>' ).css( 'width', '8em' ) )
-                               .append( $( '<th>Call</th>' ).css( 'width', '18em' ) )
+                               .append( $( '<th>' ).text( '#' ).css( 'width', '4em' ) )
+                               .append( $( '<th>' ).text( 'SQL' ) )
+                               .append( $( '<th>' ).text( 'Time' ).css( 'width', '8em' ) )
+                               .append( $( '<th>' ).text( 'Call' ).css( 'width', '18em' ) )
                                .appendTo( $table );
 
                        for ( i = 0, length = this.data.queries.length; i < length; i += 1 ) {
@@ -300,7 +306,7 @@
                                $( '<tr>' )
                                        .append( $( '<td>' ).text( i + 1 ) )
                                        .append( $( '<td>' ).text( query.sql ) )
-                                       .append( $( '<td class="stats">' ).text( ( query.time * 1000 ).toFixed( 4 ) + 'ms' ) )
+                                       .append( $( '<td>' ).text( ( query.time * 1000 ).toFixed( 4 ) + 'ms' ).addClass( 'stats' ) )
                                        .append( $( '<td>' ).text( query[ 'function' ] ) )
                                        .appendTo( $table );
                        }
@@ -375,7 +381,7 @@
                                file = this.data.includes[ i ];
                                $( '<tr>' )
                                        .append( $( '<td>' ).text( file.name ) )
-                                       .append( $( '<td class="nr">' ).text( file.size ) )
+                                       .append( $( '<td>' ).text( file.size ).addClass( 'nr' ) )
                                        .appendTo( $table );
                        }
 

diff --git a/resources/src/mediawiki.debug/jquery.footHovzer.js b/resources/src/mediawiki.debug/jquery.footHovzer.js
index ef8afdf..ddb9b17 100644 (file)
--- a/resources/src/mediawiki.debug/jquery.footHovzer.js
+++ b/resources/src/mediawiki.debug/jquery.footHovzer.js
@@ -7,7 +7,7 @@
 
        function getHovzer() {
                if ( $hovzer === undefined ) {
-                       $hovzer = $( '<div id="jquery-foot-hovzer"></div>' ).appendTo( 'body' );
+                       $hovzer = $( '<div>' ).attr( 'id', 'jquery-foot-hovzer' ).appendTo( 'body' );
                }
                return $hovzer;
        }

diff --git a/resources/src/mediawiki.notification/notification.js b/resources/src/mediawiki.notification/notification.js
index 0ec010e..f72fc92 100644 (file)
--- a/resources/src/mediawiki.notification/notification.js
+++ b/resources/src/mediawiki.notification/notification.js
@@ -29,9 +29,12 @@
        function Notification( message, options ) {
                var $notification, $notificationContent;
 
-               $notification = $( '<div class="mw-notification"></div>' )
+               $notification = $( '<div>' )
                        .data( 'mw-notification', this )
-                       .addClass( options.autoHide ? 'mw-notification-autohide' : 'mw-notification-noautohide' );
+                       .addClass( [
+                               'mw-notification',
+                               options.autoHide ? 'mw-notification-autohide' : 'mw-notification-noautohide'
+                       ] );
 
                if ( options.tag ) {
                        // Sanitize options.tag before it is used by any code. (Including Notification class methods)
@@ -50,12 +53,13 @@
                }
 
                if ( options.title ) {
-                       $( '<div class="mw-notification-title"></div>' )
+                       $( '<div>' )
+                               .addClass( 'mw-notification-title' )
                                .text( options.title )
                                .appendTo( $notification );
                }
 
-               $notificationContent = $( '<div class="mw-notification-content"></div>' );
+               $notificationContent = $( '<div>' ).addClass( 'mw-notification-content' );
 
                if ( typeof message === 'object' ) {
                        // Handle mw.Message objects separately from DOM nodes and jQuery objects

diff --git a/resources/src/mediawiki.searchSuggest/searchSuggest.js b/resources/src/mediawiki.searchSuggest/searchSuggest.js
index ed4039c..554aadb 100644 (file)
--- a/resources/src/mediawiki.searchSuggest/searchSuggest.js
+++ b/resources/src/mediawiki.searchSuggest/searchSuggest.js
@@ -297,7 +297,14 @@
                                                } );
                                        } else {
                                                $input.closest( 'form' )
-                                                       .append( $( '<input type="hidden" name="fulltext" value="1"/>' ) );
+                                                       .append(
+                                                               $( '<input>' )
+                                                                       .prop( {
+                                                                               type: 'hidden',
+                                                                               value: 1
+                                                                       } )
+                                                                       .attr( 'name', 'fulltext' )
+                                                       );
                                        }
                                        return true; // allow the form to be submitted
                                }

diff --git a/resources/src/mediawiki.toc/toc.js b/resources/src/mediawiki.toc/toc.js
index 5781d88..de81d6a 100644 (file)
--- a/resources/src/mediawiki.toc/toc.js
+++ b/resources/src/mediawiki.toc/toc.js
@@ -31,7 +31,12 @@
                        if ( !$tocToggleCheckbox.length && $tocTitle.length && $tocList.length && !$tocToggleLink.length ) {
                                hideToc = mw.cookie.get( 'hidetoc' ) === '1';
 
-                               $tocToggleLink = $( '<a role="button" tabindex="0" class="togglelink"></a>' )
+                               $tocToggleLink = $( '<a>' )
+                                       .attr( {
+                                               role: 'button',
+                                               tabindex: 0
+                                       } )
+                                       .addClass( 'togglelink' )
                                        .text( mw.msg( hideToc ? 'showtoc' : 'hidetoc' ) )
                                        .on( 'click keypress', function ( e ) {
                                                if (