CINXE.COM

<!DOCTYPE html> <html class="client-nojs vector-feature-language-in-header-disabled vector-feature-language-in-main-page-header-disabled vector-feature-sticky-header-disabled vector-feature-page-tools-pinned-disabled vector-feature-toc-pinned-clientpref-1 vector-feature-main-menu-pinned-disabled vector-feature-limited-width-clientpref-1 vector-feature-limited-width-content-enabled vector-feature-custom-font-size-clientpref-1 vector-feature-appearance-pinned-clientpref-1 vector-feature-night-mode-disabled skin-theme-clientpref-day vector-toc-available" lang="en" dir="ltr"> <head> <meta charset="UTF-8"> <title>ResourceLoader/Migration guide (users) - MediaWiki</title> <script>(function(){var className="client-js vector-feature-language-in-header-disabled vector-feature-language-in-main-page-header-disabled vector-feature-sticky-header-disabled vector-feature-page-tools-pinned-disabled vector-feature-toc-pinned-clientpref-1 vector-feature-main-menu-pinned-disabled vector-feature-limited-width-clientpref-1 vector-feature-limited-width-content-enabled vector-feature-custom-font-size-clientpref-1 vector-feature-appearance-pinned-clientpref-1 vector-feature-night-mode-disabled skin-theme-clientpref-day vector-toc-available";var cookie=document.cookie.match(/(?:^|; )mediawikiwikimwclientpreferences=([^;]+)/);if(cookie){cookie[1].split('%2C').forEach(function(pref){className=className.replace(new RegExp('(^| )'+pref.replace(/-clientpref-\w+$|[^\w-]+/g,'')+'-clientpref-\\w+( |$)'),'$1'+pref+'$2');});}document.documentElement.className=className;}());RLCONF={"wgBreakFrames":false,"wgSeparatorTransformTable":["",""],"wgDigitTransformTable":["",""], "wgDefaultDateFormat":"dmy","wgMonthNames":["","January","February","March","April","May","June","July","August","September","October","November","December"],"wgRequestId":"e33ab128-f7e1-4d64-b2db-24b12ee8df1c","wgCanonicalNamespace":"","wgCanonicalSpecialPageName":false,"wgNamespaceNumber":0,"wgPageName":"ResourceLoader/Migration_guide_(users)","wgTitle":"ResourceLoader/Migration guide (users)","wgCurRevisionId":6795381,"wgRevisionId":6795381,"wgArticleId":77548,"wgIsArticle":true,"wgIsRedirect":false,"wgAction":"view","wgUserName":null,"wgUserGroups":["*"],"wgCategories":["Pages containing potentially dated statements","ResourceLoader"],"wgPageViewLanguage":"en","wgPageContentLanguage":"en","wgPageContentModel":"wikitext","wgRelevantPageName":"ResourceLoader/Migration_guide_(users)","wgRelevantArticleId":77548,"wgIsProbablyEditable":true,"wgRelevantPageIsProbablyEditable":true,"wgRestrictionEdit":[],"wgRestrictionMove":[],"wgNoticeProject":"mediawiki","wgCiteReferencePreviewsActive": true,"wgMediaViewerOnClick":true,"wgMediaViewerEnabledByDefault":true,"wgVisualEditor":{"pageLanguageCode":"en","pageLanguageDir":"ltr","pageVariantFallbacks":"en"},"wgMFDisplayWikibaseDescriptions":{"search":true,"watchlist":true,"tagline":false,"nearby":true},"wgWMESchemaEditAttemptStepOversample":false,"wgWMEPageLength":80000,"wgTranslatePageTranslation":"source","wgCentralAuthMobileDomain":false,"wgEditSubmitButtonLabelPublish":true,"wgDiscussionToolsFeaturesEnabled":{"replytool":true,"newtopictool":true,"sourcemodetoolbar":true,"topicsubscription":false,"autotopicsub":false,"visualenhancements":false,"visualenhancements_reply":false,"visualenhancements_pageframe":false},"wgDiscussionToolsFallbackEditMode":"visual","wgULSPosition":"personal","wgULSisCompactLinksEnabled":true,"wgVector2022LanguageInHeader":false,"wgULSisLanguageSelectorEmpty":false,"wgCheckUserClientHintsHeadersJsApi":["brands","architecture","bitness","fullVersionList","mobile","model","platform","platformVersion"] };RLSTATE={"ext.globalCssJs.user.styles":"ready","site.styles":"ready","user.styles":"ready","ext.globalCssJs.user":"ready","user":"ready","user.options":"loading","ext.translate.tag.languages":"ready","ext.pygments":"ready","ext.discussionTools.init.styles":"ready","oojs-ui-core.styles":"ready","oojs-ui.styles.indicators":"ready","mediawiki.widgets.styles":"ready","oojs-ui-core.icons":"ready","skins.vector.search.codex.styles":"ready","skins.vector.styles":"ready","skins.vector.icons":"ready","jquery.tablesorter.styles":"ready","ext.translate.edit.documentation.styles":"ready","ext.translate":"ready","ext.wikimediamessages.styles":"ready","ext.visualEditor.desktopArticleTarget.noscript":"ready","ext.uls.pt":"ready","wikibase.client.init":"ready","ext.wikimediaBadges":"ready"};RLPAGEMODULES=["ext.pygments.view","site","mediawiki.page.ready","jquery.tablesorter","mediawiki.toc","skins.vector.js","ext.centralNotice.geoIP","ext.centralNotice.startUp","ext.translate.pagetranslation.uls", "ext.urlShortener.toolbar","ext.centralauth.centralautologin","ext.visualEditor.desktopArticleTarget.init","ext.visualEditor.targetLoader","ext.echo.centralauth","ext.discussionTools.init","ext.eventLogging","ext.wikimediaEvents","ext.navigationTiming","ext.uls.compactlinks","ext.uls.interface","ext.checkUser.clientHints"];</script> <script>(RLQ=window.RLQ||[]).push(function(){mw.loader.impl(function(){return["user.options@12s5i",function($,jQuery,require,module){mw.user.tokens.set({"patrolToken":"+\\","watchToken":"+\\","csrfToken":"+\\"}); }];});});</script> <link rel="stylesheet" href="/w/load.php?lang=en&modules=ext.discussionTools.init.styles%7Cext.pygments%2Ctranslate%2CwikimediaBadges%7Cext.translate.edit.documentation.styles%7Cext.translate.tag.languages%7Cext.uls.pt%7Cext.visualEditor.desktopArticleTarget.noscript%7Cext.wikimediamessages.styles%7Cjquery.tablesorter.styles%7Cmediawiki.widgets.styles%7Coojs-ui-core.icons%2Cstyles%7Coojs-ui.styles.indicators%7Cskins.vector.icons%2Cstyles%7Cskins.vector.search.codex.styles%7Cwikibase.client.init&only=styles&skin=vector-2022"> <script async="" src="/w/load.php?lang=en&modules=startup&only=scripts&raw=1&skin=vector-2022"></script> <meta name="ResourceLoaderDynamicStyles" content=""> <link rel="stylesheet" href="/w/load.php?lang=en&modules=site.styles&only=styles&skin=vector-2022"> <meta name="generator" content="MediaWiki 1.44.0-wmf.4"> <meta name="referrer" content="origin"> <meta name="referrer" content="origin-when-cross-origin"> <meta name="robots" content="max-image-preview:standard"> <meta name="format-detection" content="telephone=no"> <meta name="viewport" content="width=1120"> <meta property="og:site_name" content="MediaWiki"> <meta property="og:title" content="ResourceLoader/Migration guide (users) - MediaWiki"> <meta property="og:type" content="website"> <link rel="alternate" media="only screen and (max-width: 640px)" href="//m.mediawiki.org/wiki/ResourceLoader/Migration_guide_(users)"> <link rel="alternate" type="application/x-wiki" title="Edit" href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit"> <link rel="apple-touch-icon" href="/static/apple-touch/mediawiki.png"> <link rel="icon" href="/static/favicon/mediawiki.ico"> <link rel="search" type="application/opensearchdescription+xml" href="/w/rest.php/v1/search" title="MediaWiki (en)"> <link rel="EditURI" type="application/rsd+xml" href="//www.mediawiki.org/w/api.php?action=rsd"> <link rel="canonical" href="https://www.mediawiki.org/wiki/ResourceLoader/Migration_guide_(users)"> <link rel="license" href="https://creativecommons.org/licenses/by-sa/4.0/"> <link rel="alternate" type="application/atom+xml" title="MediaWiki Atom feed" href="/w/index.php?title=Special:RecentChanges&feed=atom"> <link rel="dns-prefetch" href="//meta.wikimedia.org" /> <link rel="dns-prefetch" href="//login.wikimedia.org"> </head> <body class="ext-discussiontools-replytool-enabled ext-discussiontools-newtopictool-enabled ext-discussiontools-sourcemodetoolbar-enabled skin--responsive skin-vector skin-vector-search-vue mediawiki ltr sitedir-ltr mw-hide-empty-elt ns-0 ns-subject mw-editable page-ResourceLoader_Migration_guide_users rootpage-ResourceLoader skin-vector-2022 action-view"><a class="mw-jump-link" href="#bodyContent">Jump to content</a> <div class="vector-header-container"> <header class="vector-header mw-header"> <div class="vector-header-start"> <nav class="vector-main-menu-landmark" aria-label="Site"> <div id="vector-main-menu-dropdown" class="vector-dropdown vector-main-menu-dropdown vector-button-flush-left vector-button-flush-right" > <input type="checkbox" id="vector-main-menu-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-main-menu-dropdown" class="vector-dropdown-checkbox " aria-label="Main menu" > <label id="vector-main-menu-dropdown-label" for="vector-main-menu-dropdown-checkbox" class="vector-dropdown-label cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only " aria-hidden="true" > Main menu </label> <div class="vector-dropdown-content"> <div id="vector-main-menu-unpinned-container" class="vector-unpinned-container"> <div id="vector-main-menu" class="vector-main-menu vector-pinnable-element"> <div class="vector-pinnable-header vector-main-menu-pinnable-header vector-pinnable-header-unpinned" data-feature-name="main-menu-pinned" data-pinnable-element-id="vector-main-menu" data-pinned-container-id="vector-main-menu-pinned-container" data-unpinned-container-id="vector-main-menu-unpinned-container" > <div class="vector-pinnable-header-label">Main menu</div> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-pin-button" data-event-name="pinnable-header.vector-main-menu.pin">move to sidebar</button> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-unpin-button" data-event-name="pinnable-header.vector-main-menu.unpin">hide</button> </div> <div id="p-navigation" class="vector-menu mw-portlet mw-portlet-navigation" > <div class="vector-menu-heading"> Navigation </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="n-mainpage-description" class="mw-list-item"><a href="/wiki/MediaWiki" title="Visit the main page [z]" accesskey="z">Main page</a></li><li id="n-mw-download" class="mw-list-item"><a href="/wiki/Download">Get MediaWiki</a></li><li id="n-mw-extensions" class="mw-list-item"><a href="/wiki/Special:MyLanguage/Category:Extensions">Get extensions</a></li><li id="n-blog-text" class="mw-list-item"><a href="https://techblog.wikimedia.org/">Tech blog</a></li><li id="n-mw-contribute" class="mw-list-item"><a href="/wiki/Special:MyLanguage/How_to_contribute">Contribute</a></li> </ul> </div> </div> <div id="p-support" class="vector-menu mw-portlet mw-portlet-support" > <div class="vector-menu-heading"> Support </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="n-help" class="mw-list-item"><a href="/wiki/Special:MyLanguage/Help:Contents" title="The place to find out">User help</a></li><li id="n-mw-faq" class="mw-list-item"><a href="/wiki/Special:MyLanguage/Manual:FAQ">FAQ</a></li><li id="n-mw-manual" class="mw-list-item"><a href="/wiki/Special:MyLanguage/Manual:Contents">Technical manual</a></li><li id="n-mw-supportdesk" class="mw-list-item"><a href="/wiki/Project:Support_desk">Support desk</a></li><li id="n-mw-communication" class="mw-list-item"><a href="/wiki/Special:MyLanguage/Communication">Communication</a></li> </ul> </div> </div> <div id="p-development" class="vector-menu mw-portlet mw-portlet-development" > <div class="vector-menu-heading"> Development </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="n-mw-developerportal" class="mw-list-item"><a href="https://developer.wikimedia.org/">Developer portal</a></li><li id="n-svn-statistics" class="mw-list-item"><a href="/wiki/Development_statistics">Code statistics</a></li> </ul> </div> </div> <div id="p-mediawiki.org" class="vector-menu mw-portlet mw-portlet-mediawiki_org" > <div class="vector-menu-heading"> mediawiki.org </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="n-portal" class="mw-list-item"><a href="/wiki/Project:Help" title="About the project, what you can do, where to find things">Community portal</a></li><li id="n-recentchanges" class="mw-list-item"><a href="/wiki/Special:RecentChanges" title="A list of recent changes in the wiki [r]" accesskey="r">Recent changes</a></li><li id="n-mw-translate" class="mw-list-item"><a href="/wiki/Special:LanguageStats">Translate content</a></li><li id="n-randompage" class="mw-list-item"><a href="/wiki/Special:Random" title="Load a random page [x]" accesskey="x">Random page</a></li><li id="n-mw-discussion" class="mw-list-item"><a href="/wiki/Project:Village_Pump">Village pump</a></li><li id="n-Sandboxlink-portlet-label" class="mw-list-item"><a href="/wiki/Project:Sandbox">Sandbox</a></li> </ul> </div> </div> <div id="p-lang" class="vector-menu mw-portlet mw-portlet-lang" > <div class="vector-menu-heading"> In other languages </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> </ul> <div class="after-portlet after-portlet-lang"><a href="https://www.wikidata.org/wiki/Special:NewItem?site=mediawikiwiki&page=ResourceLoader%2FMigration+guide+%28users%29" title="Add interlanguage links" class="wbc-editpage">Add links</a></div> </div> </div> </div> </div> </div> </div> </nav> <a href="/wiki/MediaWiki" class="mw-logo"> <img class="mw-logo-icon" src="/static/images/icons/mediawikiwiki.svg" alt="" aria-hidden="true" height="50" width="50"> <img class="mw-logo-wordmark" alt="MediaWiki" src="/static/images/mobile/copyright/mediawikiwiki-wordmark.svg" style="width: 7.5em; height: 1.125em;"> </a> </div> <div class="vector-header-end"> <div id="p-search" role="search" class="vector-search-box-vue vector-search-box-collapses vector-search-box-show-thumbnail vector-search-box-auto-expand-width vector-search-box"> <a href="/wiki/Special:Search" class="cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only search-toggle" title="Search MediaWiki [f]" accesskey="f"> Search </a> <div class="vector-typeahead-search-container"> <div class="cdx-typeahead-search cdx-typeahead-search--show-thumbnail cdx-typeahead-search--auto-expand-width"> <form action="/w/index.php" id="searchform" class="cdx-search-input cdx-search-input--has-end-button"> <div id="simpleSearch" class="cdx-search-input__input-wrapper" data-search-loc="header-moved"> <div class="cdx-text-input cdx-text-input--has-start-icon"> <input class="cdx-text-input__input" type="search" name="search" placeholder="Search MediaWiki" aria-label="Search MediaWiki" autocapitalize="sentences" title="Search MediaWiki [f]" accesskey="f" id="searchInput" > </div> <input type="hidden" name="title" value="Special:Search"> </div> <button class="cdx-button cdx-search-input__end-button">Search</button> </form> </div> </div> </div> <nav class="vector-user-links vector-user-links-wide" aria-label="Personal tools"> <div class="vector-user-links-main"> <div id="p-vector-user-menu-preferences" class="vector-menu mw-portlet" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="ca-uls" class="mw-list-item active user-links-collapsible-item"><a data-mw="interface" href="#" class="uls-trigger cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet"> English</a> </li> </ul> </div> </div> <div id="p-vector-user-menu-userpage" class="vector-menu mw-portlet emptyPortlet" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> </ul> </div> </div> <nav class="vector-appearance-landmark" aria-label="Appearance"> <div id="vector-appearance-dropdown" class="vector-dropdown " title="Change the appearance of the page's font size, width, and color" > <input type="checkbox" id="vector-appearance-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-appearance-dropdown" class="vector-dropdown-checkbox " aria-label="Appearance" > <label id="vector-appearance-dropdown-label" for="vector-appearance-dropdown-checkbox" class="vector-dropdown-label cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only " aria-hidden="true" > Appearance </label> <div class="vector-dropdown-content"> <div id="vector-appearance-unpinned-container" class="vector-unpinned-container"> </div> </div> </div> </nav> <div id="p-vector-user-menu-notifications" class="vector-menu mw-portlet emptyPortlet" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> </ul> </div> </div> <div id="p-vector-user-menu-overflow" class="vector-menu mw-portlet" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="pt-sitesupport-2" class="user-links-collapsible-item mw-list-item user-links-collapsible-item"><a data-mw="interface" href="https://donate.wikimedia.org/?utm_source=donate&utm_medium=sidebar&utm_campaign=spontaneous&uselang=en" class="">Donate</a> </li> <li id="pt-createaccount-2" class="user-links-collapsible-item mw-list-item user-links-collapsible-item"><a data-mw="interface" href="/w/index.php?title=Special:CreateAccount&returnto=ResourceLoader%2FMigration+guide+%28users%29" title="You are encouraged to create an account and log in; however, it is not mandatory" class="">Create account</a> </li> <li id="pt-login-2" class="user-links-collapsible-item mw-list-item user-links-collapsible-item"><a data-mw="interface" href="/w/index.php?title=Special:UserLogin&returnto=ResourceLoader%2FMigration+guide+%28users%29" title="You are encouraged to log in; however, it is not mandatory [o]" accesskey="o" class="">Log in</a> </li> </ul> </div> </div> </div> <div id="vector-user-links-dropdown" class="vector-dropdown vector-user-menu vector-button-flush-right vector-user-menu-logged-out" title="More options" > <input type="checkbox" id="vector-user-links-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-user-links-dropdown" class="vector-dropdown-checkbox " aria-label="Personal tools" > <label id="vector-user-links-dropdown-label" for="vector-user-links-dropdown-checkbox" class="vector-dropdown-label cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only " aria-hidden="true" > Personal tools </label> <div class="vector-dropdown-content"> <div id="p-personal" class="vector-menu mw-portlet mw-portlet-personal user-links-collapsible-item" title="User menu" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="pt-sitesupport" class="user-links-collapsible-item mw-list-item"><a href="https://donate.wikimedia.org/?utm_source=donate&utm_medium=sidebar&utm_campaign=spontaneous&uselang=en">Donate</a></li><li id="pt-createaccount" class="user-links-collapsible-item mw-list-item"><a href="/w/index.php?title=Special:CreateAccount&returnto=ResourceLoader%2FMigration+guide+%28users%29" title="You are encouraged to create an account and log in; however, it is not mandatory"> Create account</a></li><li id="pt-login" class="user-links-collapsible-item mw-list-item"><a href="/w/index.php?title=Special:UserLogin&returnto=ResourceLoader%2FMigration+guide+%28users%29" title="You are encouraged to log in; however, it is not mandatory [o]" accesskey="o"> Log in</a></li> </ul> </div> </div> <div id="p-user-menu-anon-editor" class="vector-menu mw-portlet mw-portlet-user-menu-anon-editor" > <div class="vector-menu-heading"> Pages for logged out editors <a href="/wiki/Help:Introduction" aria-label="Learn more about editing">learn more</a> </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="pt-anoncontribs" class="mw-list-item"><a href="/wiki/Special:MyContributions" title="A list of edits made from this IP address [y]" accesskey="y">Contributions</a></li><li id="pt-anontalk" class="mw-list-item"><a href="/wiki/Special:MyTalk" title="Discussion about edits from this IP address [n]" accesskey="n">Talk</a></li> </ul> </div> </div> </div> </div> </nav> </div> </header> </div> <div class="mw-page-container"> <div class="mw-page-container-inner"> <div class="vector-sitenotice-container"> <div id="siteNotice"></div> </div> <div class="vector-column-start"> <div class="vector-main-menu-container"> <div id="mw-navigation"> <nav id="mw-panel" class="vector-main-menu-landmark" aria-label="Site"> <div id="vector-main-menu-pinned-container" class="vector-pinned-container"> </div> </nav> </div> </div> <div class="vector-sticky-pinned-container"> <nav id="mw-panel-toc" aria-label="Contents" data-event-name="ui.sidebar-toc" class="mw-table-of-contents-container vector-toc-landmark"> <div id="vector-toc-pinned-container" class="vector-pinned-container"> <div id="vector-toc" class="vector-toc vector-pinnable-element"> <div class="vector-pinnable-header vector-toc-pinnable-header vector-pinnable-header-pinned" data-feature-name="toc-pinned" data-pinnable-element-id="vector-toc" > <h2 class="vector-pinnable-header-label">Contents</h2> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-pin-button" data-event-name="pinnable-header.vector-toc.pin">move to sidebar</button> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-unpin-button" data-event-name="pinnable-header.vector-toc.unpin">hide</button> </div> <ul class="vector-toc-contents" id="mw-panel-toc-list"> <li id="toc-mw-content-text" class="vector-toc-list-item vector-toc-level-1"> <a href="#" class="vector-toc-link"> <div class="vector-toc-text">Beginning</div> </a> </li> <li id="toc-MediaWiki_1.43" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.43"> <div class="vector-toc-text"> 1 MediaWiki 1.43 </div> </a> <button aria-controls="toc-MediaWiki_1.43-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.43 subsection </button> <ul id="toc-MediaWiki_1.43-sublist" class="vector-toc-list"> <li id="toc-mediawiki.Uri" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#mediawiki.Uri"> <div class="vector-toc-text"> 1.1 mediawiki.Uri </div> </a> <ul id="toc-mediawiki.Uri-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.41" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.41"> <div class="vector-toc-text"> 2 MediaWiki 1.41 </div> </a> <button aria-controls="toc-MediaWiki_1.41-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.41 subsection </button> <ul id="toc-MediaWiki_1.41-sublist" class="vector-toc-list"> <li id="toc-jquery.cookie" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#jquery.cookie"> <div class="vector-toc-text"> 2.1 jquery.cookie </div> </a> <ul id="toc-jquery.cookie-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.39" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.39"> <div class="vector-toc-text"> 3 MediaWiki 1.39 </div> </a> <button aria-controls="toc-MediaWiki_1.39-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.39 subsection </button> <ul id="toc-MediaWiki_1.39-sublist" class="vector-toc-list"> <li id="toc-jquery.hoverIntent" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#jquery.hoverIntent"> <div class="vector-toc-text"> 3.1 jquery.hoverIntent </div> </a> <ul id="toc-jquery.hoverIntent-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.38" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.38"> <div class="vector-toc-text"> 4 MediaWiki 1.38 </div> </a> <button aria-controls="toc-MediaWiki_1.38-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.38 subsection </button> <ul id="toc-MediaWiki_1.38-sublist" class="vector-toc-list"> <li id="toc-jquery.jStorage" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#jquery.jStorage"> <div class="vector-toc-text"> 4.1 jquery.jStorage </div> </a> <ul id="toc-jquery.jStorage-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Package_Gadgets" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Package_Gadgets"> <div class="vector-toc-text"> 4.2 Package Gadgets </div> </a> <ul id="toc-Package_Gadgets-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.37" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.37"> <div class="vector-toc-text"> 5 MediaWiki 1.37 </div> </a> <button aria-controls="toc-MediaWiki_1.37-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.37 subsection </button> <ul id="toc-MediaWiki_1.37-sublist" class="vector-toc-list"> <li id="toc-jQuery_Migrate_3" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#jQuery_Migrate_3"> <div class="vector-toc-text"> 5.1 jQuery Migrate 3 </div> </a> <ul id="toc-jQuery_Migrate_3-sublist" class="vector-toc-list"> <li id="toc-$wgIncludejQueryMigrate" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#$wgIncludejQueryMigrate"> <div class="vector-toc-text"> 5.1.1 $wgIncludejQueryMigrate </div> </a> <ul id="toc-$wgIncludejQueryMigrate-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.36" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.36"> <div class="vector-toc-text"> 6 MediaWiki 1.36 </div> </a> <ul id="toc-MediaWiki_1.36-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-MediaWiki_1.35" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.35"> <div class="vector-toc-text"> 7 MediaWiki 1.35 </div> </a> <button aria-controls="toc-MediaWiki_1.35-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.35 subsection </button> <ul id="toc-MediaWiki_1.35-sublist" class="vector-toc-list"> <li id="toc-user.tokens_module" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#user.tokens_module"> <div class="vector-toc-text"> 7.1 user.tokens module </div> </a> <ul id="toc-user.tokens_module-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-mediawiki.notify" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#mediawiki.notify"> <div class="vector-toc-text"> 7.2 mediawiki.notify </div> </a> <ul id="toc-mediawiki.notify-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.34" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.34"> <div class="vector-toc-text"> 8 MediaWiki 1.34 </div> </a> <button aria-controls="toc-MediaWiki_1.34-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.34 subsection </button> <ul id="toc-MediaWiki_1.34-sublist" class="vector-toc-list"> <li id="toc-Module_deprecations" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Module_deprecations"> <div class="vector-toc-text"> 8.1 Module deprecations </div> </a> <ul id="toc-Module_deprecations-sublist" class="vector-toc-list"> <li id="toc-jquery.ui.*" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#jquery.ui.*"> <div class="vector-toc-text"> 8.1.1 jquery.ui.* </div> </a> <ul id="toc-jquery.ui.*-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-accessKeyLabel" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#accessKeyLabel"> <div class="vector-toc-text"> 8.1.2 accessKeyLabel </div> </a> <ul id="toc-accessKeyLabel-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-mediawiki.RegExp" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#mediawiki.RegExp"> <div class="vector-toc-text"> 8.1.3 mediawiki.RegExp </div> </a> <ul id="toc-mediawiki.RegExp-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-jquery.tabIndex" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#jquery.tabIndex"> <div class="vector-toc-text"> 8.1.4 jquery.tabIndex </div> </a> <ul id="toc-jquery.tabIndex-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-mw.user.tokens_editToken" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#mw.user.tokens_editToken"> <div class="vector-toc-text"> 8.2 mw.user.tokens editToken </div> </a> <ul id="toc-mw.user.tokens_editToken-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.32" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.32"> <div class="vector-toc-text"> 9 MediaWiki 1.32 </div> </a> <button aria-controls="toc-MediaWiki_1.32-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.32 subsection </button> <ul id="toc-MediaWiki_1.32-sublist" class="vector-toc-list"> <li id="toc-Api_modules" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Api_modules"> <div class="vector-toc-text"> 9.1 Api modules </div> </a> <ul id="toc-Api_modules-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-wikiGetlink" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#wikiGetlink"> <div class="vector-toc-text"> 9.2 wikiGetlink </div> </a> <ul id="toc-wikiGetlink-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-wgEnableAPI" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#wgEnableAPI"> <div class="vector-toc-text"> 9.3 wgEnableAPI </div> </a> <ul id="toc-wgEnableAPI-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.31" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.31"> <div class="vector-toc-text"> 10 MediaWiki 1.31 </div> </a> <button aria-controls="toc-MediaWiki_1.31-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.31 subsection </button> <ul id="toc-MediaWiki_1.31-sublist" class="vector-toc-list"> <li id="toc-Internet_Explorer_10_browser" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Internet_Explorer_10_browser"> <div class="vector-toc-text"> 10.1 Internet Explorer 10 browser </div> </a> <ul id="toc-Internet_Explorer_10_browser-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-jquery.placeholder" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#jquery.placeholder"> <div class="vector-toc-text"> 10.2 jquery.placeholder </div> </a> <ul id="toc-jquery.placeholder-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.30" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.30"> <div class="vector-toc-text"> 11 MediaWiki 1.30 </div> </a> <button aria-controls="toc-MediaWiki_1.30-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.30 subsection </button> <ul id="toc-MediaWiki_1.30-sublist" class="vector-toc-list"> <li id="toc-jquery.mwExtension" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#jquery.mwExtension"> <div class="vector-toc-text"> 11.1 jquery.mwExtension </div> </a> <ul id="toc-jquery.mwExtension-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.29" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.29"> <div class="vector-toc-text"> 12 MediaWiki 1.29 </div> </a> <button aria-controls="toc-MediaWiki_1.29-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.29 subsection </button> <ul id="toc-MediaWiki_1.29-sublist" class="vector-toc-list"> <li id="toc-Legacy_removals" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Legacy_removals"> <div class="vector-toc-text"> 12.1 Legacy removals </div> </a> <ul id="toc-Legacy_removals-sublist" class="vector-toc-list"> <li id="toc-How_to_migrate" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#How_to_migrate"> <div class="vector-toc-text"> 12.1.1 How to migrate </div> </a> <ul id="toc-How_to_migrate-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-Gadget_type" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Gadget_type"> <div class="vector-toc-text"> 12.2 Gadget type </div> </a> <ul id="toc-Gadget_type-sublist" class="vector-toc-list"> <li id="toc-Background" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#Background"> <div class="vector-toc-text"> 12.2.1 Background </div> </a> <ul id="toc-Background-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-What's_new" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#What's_new"> <div class="vector-toc-text"> 12.2.2 What's new </div> </a> <ul id="toc-What's_new-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-How_to_migrate_2" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#How_to_migrate_2"> <div class="vector-toc-text"> 12.2.3 How to migrate </div> </a> <ul id="toc-How_to_migrate_2-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-Gadget_peers" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Gadget_peers"> <div class="vector-toc-text"> 12.3 Gadget peers </div> </a> <ul id="toc-Gadget_peers-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Internet_Explorer_9_and_pre-ES5_browsers" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Internet_Explorer_9_and_pre-ES5_browsers"> <div class="vector-toc-text"> 12.4 Internet Explorer 9 and pre-ES5 browsers </div> </a> <ul id="toc-Internet_Explorer_9_and_pre-ES5_browsers-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.28" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.28"> <div class="vector-toc-text"> 13 MediaWiki 1.28 </div> </a> <ul id="toc-MediaWiki_1.28-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-MediaWiki_1.27" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.27"> <div class="vector-toc-text"> 14 MediaWiki 1.27 </div> </a> <button aria-controls="toc-MediaWiki_1.27-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.27 subsection </button> <ul id="toc-MediaWiki_1.27-sublist" class="vector-toc-list"> <li id="toc-Legacy_default:_mediawiki.util" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Legacy_default:_mediawiki.util"> <div class="vector-toc-text"> 14.1 Legacy default: mediawiki.util </div> </a> <ul id="toc-Legacy_default:_mediawiki.util-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-bits.wikimedia.org" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#bits.wikimedia.org"> <div class="vector-toc-text"> 14.2 bits.wikimedia.org </div> </a> <ul id="toc-bits.wikimedia.org-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Internet_Explorer_8" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Internet_Explorer_8"> <div class="vector-toc-text"> 14.3 Internet Explorer 8 </div> </a> <ul id="toc-Internet_Explorer_8-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.26" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.26"> <div class="vector-toc-text"> 15 MediaWiki 1.26 </div> </a> <button aria-controls="toc-MediaWiki_1.26-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.26 subsection </button> <ul id="toc-MediaWiki_1.26-sublist" class="vector-toc-list"> <li id="toc-Legacy_gadgets" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Legacy_gadgets"> <div class="vector-toc-text"> 15.1 Legacy gadgets </div> </a> <ul id="toc-Legacy_gadgets-sublist" class="vector-toc-list"> <li id="toc-Global_variables_are_not_global" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#Global_variables_are_not_global"> <div class="vector-toc-text"> 15.1.1 Global variables are not global </div> </a> <ul id="toc-Global_variables_are_not_global-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-Font_mw-geshi" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Font_mw-geshi"> <div class="vector-toc-text"> 15.2 Font mw-geshi </div> </a> <ul id="toc-Font_mw-geshi-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Inline_scripts" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Inline_scripts"> <div class="vector-toc-text"> 15.3 Inline scripts </div> </a> <ul id="toc-Inline_scripts-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.24" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.24"> <div class="vector-toc-text"> 16 MediaWiki 1.24 </div> </a> <button aria-controls="toc-MediaWiki_1.24-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.24 subsection </button> <ul id="toc-MediaWiki_1.24-sublist" class="vector-toc-list"> <li id="toc-Legacy_removals_2" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Legacy_removals_2"> <div class="vector-toc-text"> 16.1 Legacy removals </div> </a> <ul id="toc-Legacy_removals_2-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Internet_Explorer" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Internet_Explorer"> <div class="vector-toc-text"> 16.2 Internet Explorer </div> </a> <ul id="toc-Internet_Explorer-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.20" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.20"> <div class="vector-toc-text"> 17 MediaWiki 1.20 </div> </a> <button aria-controls="toc-MediaWiki_1.20-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.20 subsection </button> <ul id="toc-MediaWiki_1.20-sublist" class="vector-toc-list"> <li id="toc-mw.util.jsMessage" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#mw.util.jsMessage"> <div class="vector-toc-text"> 17.1 mw.util.jsMessage </div> </a> <ul id="toc-mw.util.jsMessage-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-New_diff_styles" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#New_diff_styles"> <div class="vector-toc-text"> 17.2 New diff styles </div> </a> <ul id="toc-New_diff_styles-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.19" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.19"> <div class="vector-toc-text"> 18 MediaWiki 1.19 </div> </a> <button aria-controls="toc-MediaWiki_1.19-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.19 subsection </button> <ul id="toc-MediaWiki_1.19-sublist" class="vector-toc-list"> <li id="toc-wikitable_style_updates" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#wikitable_style_updates"> <div class="vector-toc-text"> 18.1 wikitable style updates </div> </a> <ul id="toc-wikitable_style_updates-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-File_page_checkered_background" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#File_page_checkered_background"> <div class="vector-toc-text"> 18.2 File page checkered background </div> </a> <ul id="toc-File_page_checkered_background-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Trackbacks" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Trackbacks"> <div class="vector-toc-text"> 18.3 Trackbacks </div> </a> <ul id="toc-Trackbacks-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.18" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.18"> <div class="vector-toc-text"> 19 MediaWiki 1.18 </div> </a> <button aria-controls="toc-MediaWiki_1.18-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.18 subsection </button> <ul id="toc-MediaWiki_1.18-sublist" class="vector-toc-list"> <li id="toc-Protocol-relative_urls" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Protocol-relative_urls"> <div class="vector-toc-text"> 19.1 Protocol-relative urls </div> </a> <ul id="toc-Protocol-relative_urls-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-"Enabled_by_default"_(Gadgets_extension)" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#"Enabled_by_default"_(Gadgets_extension)"> <div class="vector-toc-text"> 19.2 "Enabled by default" (Gadgets extension) </div> </a> <ul id="toc-"Enabled_by_default"_(Gadgets_extension)-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-mw.util.wikiScript" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#mw.util.wikiScript"> <div class="vector-toc-text"> 19.3 mw.util.wikiScript </div> </a> <ul id="toc-mw.util.wikiScript-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.17" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.17"> <div class="vector-toc-text"> 20 MediaWiki 1.17 </div> </a> <button aria-controls="toc-MediaWiki_1.17-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.17 subsection </button> <ul id="toc-MediaWiki_1.17-sublist" class="vector-toc-list"> <li id="toc-jQuery" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#jQuery"> <div class="vector-toc-text"> 20.1 jQuery </div> </a> <ul id="toc-jQuery-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Tabs_(vector)" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Tabs_(vector)"> <div class="vector-toc-text"> 20.2 Tabs (vector) </div> </a> <ul id="toc-Tabs_(vector)-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Adding_portlet_links" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Adding_portlet_links"> <div class="vector-toc-text"> 20.3 Adding portlet links </div> </a> <ul id="toc-Adding_portlet_links-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Toolbar" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Toolbar"> <div class="vector-toc-text"> 20.4 Toolbar </div> </a> <ul id="toc-Toolbar-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Sajax" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Sajax"> <div class="vector-toc-text"> 20.5 Sajax </div> </a> <ul id="toc-Sajax-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Client_testing" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Client_testing"> <div class="vector-toc-text"> 20.6 Client testing </div> </a> <ul id="toc-Client_testing-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Sysop_script" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Sysop_script"> <div class="vector-toc-text"> 20.7 Sysop script </div> </a> <ul id="toc-Sysop_script-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-mw.loader" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#mw.loader"> <div class="vector-toc-text"> 20.8 mw.loader </div> </a> <ul id="toc-mw.loader-sublist" class="vector-toc-list"> <li id="toc-Dependencies" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#Dependencies"> <div class="vector-toc-text"> 20.8.1 Dependencies </div> </a> <ul id="toc-Dependencies-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-In_practice" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#In_practice"> <div class="vector-toc-text"> 20.8.2 In practice </div> </a> <ul id="toc-In_practice-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-Global_wg_variables" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Global_wg_variables"> <div class="vector-toc-text"> 20.9 Global wg variables </div> </a> <ul id="toc-Global_wg_variables-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Ready,_onload,_hook" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Ready,_onload,_hook"> <div class="vector-toc-text"> 20.10 Ready, onload, hook </div> </a> <ul id="toc-Ready,_onload,_hook-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-New_CSS_declarations_in_core" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#New_CSS_declarations_in_core"> <div class="vector-toc-text"> 20.11 New CSS declarations in core </div> </a> <ul id="toc-New_CSS_declarations_in_core-sublist" class="vector-toc-list"> <li id="toc-Headings_overflow_hidden" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#Headings_overflow_hidden"> <div class="vector-toc-text"> 20.11.1 Headings overflow hidden </div> </a> <ul id="toc-Headings_overflow_hidden-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Italic_redirects" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#Italic_redirects"> <div class="vector-toc-text"> 20.11.2 Italic redirects </div> </a> <ul id="toc-Italic_redirects-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-wpSummary" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#wpSummary"> <div class="vector-toc-text"> 20.11.3 wpSummary </div> </a> <ul id="toc-wpSummary-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-UsabilityInitiative_no_more" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#UsabilityInitiative_no_more"> <div class="vector-toc-text"> 20.12 UsabilityInitiative no more </div> </a> <ul id="toc-UsabilityInitiative_no_more-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Preformatted_JS/CSS_pages" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Preformatted_JS/CSS_pages"> <div class="vector-toc-text"> 20.13 Preformatted JS/CSS pages </div> </a> <ul id="toc-Preformatted_JS/CSS_pages-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Table_sorter" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Table_sorter"> <div class="vector-toc-text"> 20.14 Table sorter </div> </a> <ul id="toc-Table_sorter-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-MediaWiki_1.16_and_before" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#MediaWiki_1.16_and_before"> <div class="vector-toc-text"> 21 MediaWiki 1.16 and before </div> </a> <button aria-controls="toc-MediaWiki_1.16_and_before-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle MediaWiki 1.16 and before subsection </button> <ul id="toc-MediaWiki_1.16_and_before-sublist" class="vector-toc-list"> <li id="toc-importScript" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#importScript"> <div class="vector-toc-text"> 21.1 importScript </div> </a> <ul id="toc-importScript-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-addPortletLink" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#addPortletLink"> <div class="vector-toc-text"> 21.2 addPortletLink </div> </a> <ul id="toc-addPortletLink-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-appendCSS" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#appendCSS"> <div class="vector-toc-text"> 21.3 appendCSS </div> </a> <ul id="toc-appendCSS-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-HTML_bugs_in_core" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#HTML_bugs_in_core"> <div class="vector-toc-text"> 21.4 HTML bugs in core </div> </a> <ul id="toc-HTML_bugs_in_core-sublist" class="vector-toc-list"> <li id="toc-html_lang" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#html_lang"> <div class="vector-toc-text"> 21.4.1 html lang </div> </a> <ul id="toc-html_lang-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-CSS_declarations_new_in_core" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#CSS_declarations_new_in_core"> <div class="vector-toc-text"> 21.5 CSS declarations new in core </div> </a> <ul id="toc-CSS_declarations_new_in_core-sublist" class="vector-toc-list"> <li id="toc-wikitable" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#wikitable"> <div class="vector-toc-text"> 21.5.1 wikitable </div> </a> <ul id="toc-wikitable-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-plainlinks" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#plainlinks"> <div class="vector-toc-text"> 21.5.2 plainlinks </div> </a> <ul id="toc-plainlinks-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-mw-plusminus" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#mw-plusminus"> <div class="vector-toc-text"> 21.5.3 mw-plusminus </div> </a> <ul id="toc-mw-plusminus-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-External_URLs" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#External_URLs"> <div class="vector-toc-text"> 21.5.4 External URLs </div> </a> <ul id="toc-External_URLs-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-Tooltip_and_accesskeys" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Tooltip_and_accesskeys"> <div class="vector-toc-text"> 21.6 Tooltip and accesskeys </div> </a> <ul id="toc-Tooltip_and_accesskeys-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-Best_practices" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#Best_practices"> <div class="vector-toc-text"> 22 Best practices </div> </a> <button aria-controls="toc-Best_practices-sublist" class="cdx-button cdx-button--weight-quiet cdx-button--icon-only vector-toc-toggle"> Toggle Best practices subsection </button> <ul id="toc-Best_practices-sublist" class="vector-toc-list"> <li id="toc-Avoid_document.write()" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Avoid_document.write()"> <div class="vector-toc-text"> 22.1 Avoid document.write() </div> </a> <ul id="toc-Avoid_document.write()-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Event_binding" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Event_binding"> <div class="vector-toc-text"> 22.2 Event binding </div> </a> <ul id="toc-Event_binding-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Encoding_and_escaping" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Encoding_and_escaping"> <div class="vector-toc-text"> 22.3 Encoding and escaping </div> </a> <ul id="toc-Encoding_and_escaping-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Prototyping" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Prototyping"> <div class="vector-toc-text"> 22.4 Prototyping </div> </a> <ul id="toc-Prototyping-sublist" class="vector-toc-list"> <li id="toc-Polyfills" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#Polyfills"> <div class="vector-toc-text"> 22.4.1 Polyfills </div> </a> <ul id="toc-Polyfills-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-Getting_URL_parameter_values" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Getting_URL_parameter_values"> <div class="vector-toc-text"> 22.5 Getting URL parameter values </div> </a> <ul id="toc-Getting_URL_parameter_values-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Avoid_use_of_!important" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Avoid_use_of_!important"> <div class="vector-toc-text"> 22.6 Avoid use of !important </div> </a> <ul id="toc-Avoid_use_of_!important-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-Keep_gadgets_central" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Keep_gadgets_central"> <div class="vector-toc-text"> 22.7 Keep gadgets central </div> </a> <ul id="toc-Keep_gadgets_central-sublist" class="vector-toc-list"> <li id="toc-Gadgets" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#Gadgets"> <div class="vector-toc-text"> 22.7.1 Gadgets </div> </a> <ul id="toc-Gadgets-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-jQuery_optimization" class="vector-toc-list-item vector-toc-level-3"> <a class="vector-toc-link" href="#jQuery_optimization"> <div class="vector-toc-text"> 22.7.2 jQuery optimization </div> </a> <ul id="toc-jQuery_optimization-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-Use_API_instead_of_index.php" class="vector-toc-list-item vector-toc-level-2"> <a class="vector-toc-link" href="#Use_API_instead_of_index.php"> <div class="vector-toc-text"> 22.8 Use API instead of index.php </div> </a> <ul id="toc-Use_API_instead_of_index.php-sublist" class="vector-toc-list"> </ul> </li> </ul> </li> <li id="toc-Conventions" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#Conventions"> <div class="vector-toc-text"> 23 Conventions </div> </a> <ul id="toc-Conventions-sublist" class="vector-toc-list"> </ul> </li> <li id="toc-See_also" class="vector-toc-list-item vector-toc-level-1"> <a class="vector-toc-link" href="#See_also"> <div class="vector-toc-text"> 24 See also </div> </a> <ul id="toc-See_also-sublist" class="vector-toc-list"> </ul> </li> </ul> </div> </div> </nav> </div> </div> <div class="mw-content-container"> <main id="content" class="mw-body"> <header class="mw-body-header vector-page-titlebar"> <nav aria-label="Contents" class="vector-toc-landmark"> <div id="vector-page-titlebar-toc" class="vector-dropdown vector-page-titlebar-toc vector-button-flush-left" > <input type="checkbox" id="vector-page-titlebar-toc-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-page-titlebar-toc" class="vector-dropdown-checkbox " aria-label="Toggle the table of contents" > <label id="vector-page-titlebar-toc-label" for="vector-page-titlebar-toc-checkbox" class="vector-dropdown-label cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet cdx-button--icon-only " aria-hidden="true" > Toggle the table of contents </label> <div class="vector-dropdown-content"> <div id="vector-page-titlebar-toc-unpinned-container" class="vector-unpinned-container"> </div> </div> </div> </nav> <h1 id="firstHeading" class="firstHeading mw-first-heading">ResourceLoader/Migration guide (users)</h1> <div class="mw-indicators"> <div id="mw-indicator-tpl-shortcut" class="mw-indicator"><div class="mw-parser-output"><div class="mw-parser-output"><style data-mw-deduplicate="TemplateStyles:r6605561">.mw-parser-output .tpl-badge{background-color:var(--background-color-progressive-subtle,#eaf3ff);color:var(--color-base,#202122);border-radius:10px;display:inline-block;font-size:90%;padding:5px 8px}</style><div class="tpl-badge">shortcut: <a href="/wiki/RL/MGU" class="mw-redirect" title="RL/MGU">RL/MGU</a></div></div></div></div> </div> </header> <div class="vector-page-toolbar"> <div class="vector-page-toolbar-container"> <div id="left-navigation"> <nav aria-label="Namespaces"> <div id="p-associated-pages" class="vector-menu vector-menu-tabs mw-portlet mw-portlet-associated-pages" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="ca-nstab-main" class="selected vector-tab-noicon mw-list-item"><a href="/wiki/ResourceLoader/Migration_guide_(users)" title="View the content page [c]" accesskey="c">Page</a></li><li id="ca-talk" class="vector-tab-noicon mw-list-item"><a href="/wiki/Talk:ResourceLoader/Migration_guide_(users)" rel="discussion" title="Discussion about the content page [t]" accesskey="t">Discussion</a></li> </ul> </div> </div> <div id="vector-variants-dropdown" class="vector-dropdown emptyPortlet" > <input type="checkbox" id="vector-variants-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-variants-dropdown" class="vector-dropdown-checkbox " aria-label="Change language variant" > <label id="vector-variants-dropdown-label" for="vector-variants-dropdown-checkbox" class="vector-dropdown-label cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet" aria-hidden="true" >English </label> <div class="vector-dropdown-content"> <div id="p-variants" class="vector-menu mw-portlet mw-portlet-variants emptyPortlet" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> </ul> </div> </div> </div> </div> </nav> </div> <div id="right-navigation" class="vector-collapsible"> <nav aria-label="Views"> <div id="p-views" class="vector-menu vector-menu-tabs mw-portlet mw-portlet-views" > <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="ca-view" class="selected vector-tab-noicon mw-list-item"><a href="/wiki/ResourceLoader/Migration_guide_(users)">Read</a></li><li id="ca-edit" class="vector-tab-noicon mw-list-item"><a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit" title="Edit the source code of this page [e]" accesskey="e">Edit</a></li><li id="ca-history" class="vector-tab-noicon mw-list-item"><a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=history" title="Past revisions of this page [h]" accesskey="h">View history</a></li> </ul> </div> </div> </nav> <nav class="vector-page-tools-landmark" aria-label="Page tools"> <div id="vector-page-tools-dropdown" class="vector-dropdown vector-page-tools-dropdown" > <input type="checkbox" id="vector-page-tools-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-page-tools-dropdown" class="vector-dropdown-checkbox " aria-label="Tools" > <label id="vector-page-tools-dropdown-label" for="vector-page-tools-dropdown-checkbox" class="vector-dropdown-label cdx-button cdx-button--fake-button cdx-button--fake-button--enabled cdx-button--weight-quiet" aria-hidden="true" >Tools </label> <div class="vector-dropdown-content"> <div id="vector-page-tools-unpinned-container" class="vector-unpinned-container"> <div id="vector-page-tools" class="vector-page-tools vector-pinnable-element"> <div class="vector-pinnable-header vector-page-tools-pinnable-header vector-pinnable-header-unpinned" data-feature-name="page-tools-pinned" data-pinnable-element-id="vector-page-tools" data-pinned-container-id="vector-page-tools-pinned-container" data-unpinned-container-id="vector-page-tools-unpinned-container" > <div class="vector-pinnable-header-label">Tools</div> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-pin-button" data-event-name="pinnable-header.vector-page-tools.pin">move to sidebar</button> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-unpin-button" data-event-name="pinnable-header.vector-page-tools.unpin">hide</button> </div> <div id="p-cactions" class="vector-menu mw-portlet mw-portlet-cactions emptyPortlet vector-has-collapsible-items" title="More options" > <div class="vector-menu-heading"> Actions </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="ca-more-view" class="selected vector-more-collapsible-item mw-list-item"><a href="/wiki/ResourceLoader/Migration_guide_(users)">Read</a></li><li id="ca-more-edit" class="vector-more-collapsible-item mw-list-item"><a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit" title="Edit the source code of this page [e]" accesskey="e">Edit</a></li><li id="ca-more-history" class="vector-more-collapsible-item mw-list-item"><a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=history">View history</a></li> </ul> </div> </div> <div id="p-tb" class="vector-menu mw-portlet mw-portlet-tb" > <div class="vector-menu-heading"> General </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="t-whatlinkshere" class="mw-list-item"><a href="/wiki/Special:WhatLinksHere/ResourceLoader/Migration_guide_(users)" title="A list of all wiki pages that link here [j]" accesskey="j">What links here</a></li><li id="t-recentchangeslinked" class="mw-list-item"><a href="/wiki/Special:RecentChangesLinked/ResourceLoader/Migration_guide_(users)" rel="nofollow" title="Recent changes in pages linked from this page [k]" accesskey="k">Related changes</a></li><li id="t-upload" class="mw-list-item"><a href="//commons.wikimedia.org/wiki/Special:UploadWizard" title="Upload files [u]" accesskey="u">Upload file</a></li><li id="t-specialpages" class="mw-list-item"><a href="/wiki/Special:SpecialPages" title="A list of all special pages [q]" accesskey="q">Special pages</a></li><li id="t-permalink" class="mw-list-item"><a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&oldid=6795381" title="Permanent link to this revision of this page">Permanent link</a></li><li id="t-info" class="mw-list-item"><a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=info" title="More information about this page">Page information</a></li><li id="t-cite" class="mw-list-item"><a href="/w/index.php?title=Special:CiteThisPage&page=ResourceLoader%2FMigration_guide_%28users%29&id=6795381&wpFormIdentifier=titleform" title="Information on how to cite this page">Cite this page</a></li><li id="t-urlshortener" class="mw-list-item"><a href="/w/index.php?title=Special:UrlShortener&url=https%3A%2F%2Fwww.mediawiki.org%2Fwiki%2FResourceLoader%2FMigration_guide_%28users%29">Get shortened URL</a></li><li id="t-urlshortener-qrcode" class="mw-list-item"><a href="/w/index.php?title=Special:QrCode&url=https%3A%2F%2Fwww.mediawiki.org%2Fwiki%2FResourceLoader%2FMigration_guide_%28users%29">Download QR code</a></li> </ul> </div> </div> <div id="p-coll-print_export" class="vector-menu mw-portlet mw-portlet-coll-print_export" > <div class="vector-menu-heading"> Print/export </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> <li id="coll-create_a_book" class="mw-list-item"><a href="/w/index.php?title=Special:Book&bookcmd=book_creator&referer=ResourceLoader%2FMigration+guide+%28users%29">Create a book</a></li><li id="coll-download-as-rl" class="mw-list-item"><a href="/w/index.php?title=Special:DownloadAsPdf&page=ResourceLoader%2FMigration_guide_%28users%29&action=show-download-screen">Download as PDF</a></li><li id="t-print" class="mw-list-item"><a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&printable=yes" title="Printable version of this page [p]" accesskey="p">Printable version</a></li> </ul> </div> </div> <div id="p-wikibase-otherprojects" class="vector-menu mw-portlet mw-portlet-wikibase-otherprojects emptyPortlet" > <div class="vector-menu-heading"> In other projects </div> <div class="vector-menu-content"> <ul class="vector-menu-content-list"> </ul> </div> </div> </div> </div> </div> </div> </nav> </div> </div> </div> <div class="vector-column-end"> <div class="vector-sticky-pinned-container"> <nav class="vector-page-tools-landmark" aria-label="Page tools"> <div id="vector-page-tools-pinned-container" class="vector-pinned-container"> </div> </nav> <nav class="vector-appearance-landmark" aria-label="Appearance"> <div id="vector-appearance-pinned-container" class="vector-pinned-container"> <div id="vector-appearance" class="vector-appearance vector-pinnable-element"> <div class="vector-pinnable-header vector-appearance-pinnable-header vector-pinnable-header-pinned" data-feature-name="appearance-pinned" data-pinnable-element-id="vector-appearance" data-pinned-container-id="vector-appearance-pinned-container" data-unpinned-container-id="vector-appearance-unpinned-container" > <div class="vector-pinnable-header-label">Appearance</div> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-pin-button" data-event-name="pinnable-header.vector-appearance.pin">move to sidebar</button> <button class="vector-pinnable-header-toggle-button vector-pinnable-header-unpin-button" data-event-name="pinnable-header.vector-appearance.unpin">hide</button> </div> </div> </div> </nav> </div> </div> <div id="bodyContent" class="vector-body" aria-labelledby="firstHeading" data-mw-ve-target-container> <div class="vector-body-before-content"> <div id="siteSub" class="noprint">From mediawiki.org</div> </div> <div id="contentSub"><div id="mw-content-subtitle"><div class="subpages">< <bdi dir="ltr"><a href="/wiki/Special:MyLanguage/ResourceLoader" title="Special:MyLanguage/ResourceLoader">ResourceLoader</a></bdi></div></div></div> <div id="mw-content-text" class="mw-body-content"><div class="mw-pt-translate-header noprint nomobile" dir="ltr" lang="en"><a href="/w/index.php?title=Special:Translate&group=page-ResourceLoader%2FMigration+guide+%28users%29&action=page&filter=&action_source=translate_page" title="Special:Translate">Translate this page</a></div><div class="mw-content-ltr mw-parser-output" lang="en" dir="ltr"><div class="mw-pt-languages noprint navigation-not-searchable" lang="en" dir="ltr"><div class="mw-pt-languages-label">Languages:</div><ul class="mw-pt-languages-list"><li>English</li> <li><a href="/wiki/ResourceLoader/Migration_guide_(users)/da" class="mw-pt-progress mw-pt-progress--low" title="ResourceLoader/Migration guide (users)/da (2% translated)" lang="da" dir="ltr">dansk</a></li> <li><a href="/wiki/ResourceLoader/Migration_guide_(users)/fr" class="mw-pt-progress mw-pt-progress--high" title="ResourceLoader/Guide de migration (utilisateurs) (98% translated)" lang="fr" dir="ltr">français</a></li> <li><a href="/wiki/ResourceLoader/Migration_guide_(users)/zh" class="mw-pt-progress mw-pt-progress--low" title="ResourceLoader/迁移指导（用户） (3% translated)" lang="zh" dir="ltr">中文</a></li> <li><a href="/wiki/ResourceLoader/Migration_guide_(users)/ja" class="mw-pt-progress mw-pt-progress--low" title="ResourceLoader/Migration guide (users)/ja (6% translated)" lang="ja" dir="ltr">日本語</a></li> <li><a href="/wiki/ResourceLoader/Migration_guide_(users)/ko" class="mw-pt-progress mw-pt-progress--low" title="리소스 로더/ 마이그레이션 가이드 (이용자) (3% translated)" lang="ko" dir="ltr">한국어</a></li></ul></div> <style data-mw-deduplicate="TemplateStyles:r6605224">.mw-parser-output .tpl-sidebar{background-color:var(--background-color-interactive-subtle,#f8f9fa);border:1px solid var(--border-color-divider,#a2a9b1);color:var(--color-base,#202122);width:22em;padding:.2em;text-align:center;line-height:1.4em;font-size:88%}.mw-parser-output .tpl-sidebar-pagedir-ltr,.mw-parser-output .tpl-sidebar.tpl-sidebar-floatright{float:right;clear:right;margin:.5em 0 1em 1em}.mw-parser-output .tpl-sidebar-pagedir-rtl,.mw-parser-output .tpl-sidebar.tpl-sidebar-floatleft{float:left;clear:left;margin:.5em 1em 1em 0}.mw-parser-output .tpl-sidebar.tpl-sidebar-floatnone{float:none;clear:both;margin:.5em 0 1em 1em}.mw-parser-output .tpl-sidebar>caption{padding-bottom:.2em;font-size:125%;line-height:1.2em;font-weight:bold}.mw-parser-output .tpl-sidebar>tbody>tr>th,.mw-parser-output .tpl-sidebar>tbody>tr>td{padding:0}.mw-parser-output .tpl-sidebar .tpl-sidebar-topimage>td{padding:.4em 0}.mw-parser-output .tpl-sidebar-imagecaption{padding-top:.2em;line-height:1.2em}.mw-parser-output .tpl-sidebar .tpl-sidebar-pretitle>td{padding-top:.4em;line-height:1.2em}.mw-parser-output .tpl-sidebar .tpl-sidebar-topimage+.tpl-sidebar-pretitle>td{padding-top:.2em}.mw-parser-output .tpl-sidebar .tpl-sidebar-title>th{padding:.2em .4em .2em;font-size:145%;line-height:1.2em}.mw-parser-output .tpl-sidebar .tpl-sidebar-pretitle+.tpl-sidebar-title>th{padding-top:0}.mw-parser-output .tpl-sidebar .tpl-sidebar-image>td{padding:.2em 0 .4em}.mw-parser-output .tpl-sidebar .tpl-sidebar-abovebelow>td{padding:.3em .4em;font-weight:bold}.mw-parser-output .tpl-sidebar .tpl-sidebar-heading>th{padding-top:.2em}.mw-parser-output .tpl-sidebar .tpl-sidebar-image~.tpl-sidebar-heading-first>th{padding-top:.4em}.mw-parser-output .tpl-sidebar .tpl-sidebar-content>td{padding-bottom:.2em}.mw-parser-output .tpl-sidebar :not(.tpl-sidebar-heading)+.tpl-sidebar-content-first>td{padding-top:.2em}.mw-parser-output .tpl-sidebar-navbar>td{font-size:115%}.mw-parser-output .tpl-sidebar-pagedir-ltr .tpl-sidebar-navbar>td{text-align:right}.mw-parser-output .tpl-sidebar-pagedir-rtl .tpl-sidebar-navbar>td{text-align:left}</style><table class="vertical-navbox tpl-sidebar tpl-sidebar-pagedir-ltr nowraplinks" role="navigation" style="width:22em; border-spacing: 0.4em 0; margin-top: 0.5em; width: auto; text-align: left; font-size: 100%;"><tbody><tr class="tpl-sidebar-title"> <th class="" style="text-align: center; font-size: 100%;"><a href="/wiki/Special:MyLanguage/ResourceLoader" title="Special:MyLanguage/ResourceLoader">ResourceLoader</a></th> </tr><tr class="tpl-sidebar-heading tpl-sidebar-heading-first"> <th class="" style="font-weight: normal;;">Reference</th> </tr><tr class="tpl-sidebar-content tpl-sidebar-content-first"> <td class="" style=";"> <ul><li><a href="/wiki/Special:MyLanguage/ResourceLoader/Architecture" title="Special:MyLanguage/ResourceLoader/Architecture">Architecture</a><a href="/wiki/ResourceLoader/Architecture" title="ResourceLoader/Architecture"> </a></li> <li><a href="/wiki/Special:MyLanguage/ResourceLoader/Vocabulary" title="Special:MyLanguage/ResourceLoader/Vocabulary">Vocabulary</a><a href="/wiki/ResourceLoader/Vocabulary" title="ResourceLoader/Vocabulary"> </a></li> <li><a href="/wiki/Special:MyLanguage/ResourceLoader/Core_modules" title="Special:MyLanguage/ResourceLoader/Core modules">Core modules</a><a href="/wiki/ResourceLoader/Core_modules" title="ResourceLoader/Core modules"> </a></li> <li><a href="/wiki/Special:MyLanguage/ResourceLoader/Presentations" title="Special:MyLanguage/ResourceLoader/Presentations">Tech talks (videos, slides)</a><a href="/wiki/ResourceLoader/Presentations" title="ResourceLoader/Presentations"> </a></li></ul></td> </tr><tr class="tpl-sidebar-heading"> <th class="" style="font-weight: normal;;">Tutorials</th> </tr><tr class="tpl-sidebar-content"> <td class="" style=";"> <ul><li><a href="/wiki/Special:MyLanguage/ResourceLoader/Developing_with_ResourceLoader" title="Special:MyLanguage/ResourceLoader/Developing with ResourceLoader">Getting started</a><a href="/wiki/ResourceLoader/Developing_with_ResourceLoader" title="ResourceLoader/Developing with ResourceLoader"> </a></li> <li><a href="/wiki/Special:MyLanguage/ResourceLoader/Package_files" title="Special:MyLanguage/ResourceLoader/Package files">Using package files</a><a href="/wiki/ResourceLoader/Package_files" title="ResourceLoader/Package files"> </a></li> <li><a href="/wiki/ResourceLoader/Foreign_resources" title="ResourceLoader/Foreign resources">Foreign resources</a></li> <li><a href="/wiki/Special:MyLanguage/ResourceLoader/ES6" title="Special:MyLanguage/ResourceLoader/ES6">Using ES6</a><a href="/wiki/ResourceLoader/ES6" title="ResourceLoader/ES6"> </a></li> <li><a href="/wiki/Special:MyLanguage/ResourceLoader/Migration_guide_(users)" title="Special:MyLanguage/ResourceLoader/Migration guide (users)">Migrating user scripts</a><a class="mw-selflink selflink"> </a></li> <li><a href="/wiki/Special:MyLanguage/ResourceLoader/Migration_guide_for_extension_developers" title="Special:MyLanguage/ResourceLoader/Migration guide for extension developers">Migrating extensions</a><a href="/wiki/ResourceLoader/Migration_guide_for_extension_developers" title="ResourceLoader/Migration guide for extension developers"> </a></li></ul></td> </tr><tr class="tpl-sidebar-navbar"> <td style=""><style data-mw-deduplicate="TemplateStyles:r4692751">.mw-parser-output .navbar{display:inline;font-size:88%;font-weight:normal}.mw-parser-output .navbar ul{display:inline;white-space:nowrap}.mw-parser-output .navbar li{word-spacing:-0.125em}.mw-parser-output .navbox .navbar{display:block;font-size:100%}.mw-parser-output .navbox-title .navbar{float:left;text-align:left;margin-right:0.5em;width:6em}</style><a href="/wiki/Template:ResourceLoader_navigation" title="Template:ResourceLoader navigation">v</a> · <a class="external text" href="https://www.mediawiki.org/wiki/Template_talk:ResourceLoader_navigation">d</a> · <a class="external text" href="https://www.mediawiki.org/w/index.php?title=Template:ResourceLoader_navigation&action=edit">e</a></td> </tr> </tbody></table> Over time, MediaWiki core JavaScript functions and HTML outputs have improved in functionality, introduced new methods, been deprecated, or changed in other ways. This document intends to highlight the most common problems that need to be fixed. <ul><li>For an overview of the modules that are available in MediaWiki core, see <a href="/wiki/Special:MyLanguage/ResourceLoader/Core_modules" title="Special:MyLanguage/ResourceLoader/Core modules">ResourceLoader/Core modules</a><a href="/wiki/ResourceLoader/Core_modules" title="ResourceLoader/Core modules"> </a>.</li> <li>Problems with gadgets? Check if it's <a href="#Keep_gadgets_central">listed below</a>. If so, ask an interface administrator to update it on your wiki.</li></ul> <style data-mw-deduplicate="TemplateStyles:r4577480">.mw-parser-output .toclimit-2 .toclevel-1 ul,.mw-parser-output .toclimit-3 .toclevel-2 ul,.mw-parser-output .toclimit-4 .toclevel-3 ul,.mw-parser-output .toclimit-5 .toclevel-4 ul,.mw-parser-output .toclimit-6 .toclevel-5 ul,.mw-parser-output .toclimit-7 .toclevel-6 ul{display:none}</style><div style="margin-bottom: .5em; float: none; width: auto;" class="toclimit-3"><meta property="mw:PageProp/toc"/></div> <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.43" data-mw-thread-id="h-MediaWiki_1.43"><a href="/wiki/Special:MyLanguage/MediaWiki_1.43" title="Special:MyLanguage/MediaWiki 1.43">MediaWiki 1.43</a><a href="/wiki/MediaWiki_1.43" title="MediaWiki 1.43"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=1" title="Edit section: MediaWiki 1.43">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="mediawiki.Uri" data-mw-thread-id="h-mediawiki.Uri-MediaWiki_1.43">mediawiki.Uri</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=2" title="Edit section: mediawiki.Uri">edit</a>]</div> The <code>mediawiki.Uri</code> module provides an API to create and manipulate MediaWiki URIs. This functionality already has browser's native support and the module has been deprecated.(<a href="https://phabricator.wikimedia.org/T374314" class="extiw" title="phab:T374314">T374314</a>) <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.41" data-mw-thread-id="h-MediaWiki_1.41"><a href="/wiki/Special:MyLanguage/MediaWiki_1.41" title="Special:MyLanguage/MediaWiki 1.41">MediaWiki 1.41</a><a href="/wiki/MediaWiki_1.41" title="MediaWiki 1.41"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=3" title="Edit section: MediaWiki 1.41">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="jquery.cookie" data-mw-thread-id="h-jquery.cookie-MediaWiki_1.41">jquery.cookie</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=4" title="Edit section: jquery.cookie">edit</a>]</div> The <code>jquery.cookie</code> module provides an API to read and write raw browser cookies via <code>$.cookie</code>. This functionality has been merged into the <code>mediawiki.cookie</code> module. The <code>jquery.cookie</code> module name is now a deprecated alias for <code>mediawiki.cookie</code>. The module name alias was removed in MediaWiki 1.42. Both <code>$.cookie</code> and <code>mw.cookie</code> are now provided directly by the <code>mediawiki.cookie</code> module. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.39" data-mw-thread-id="h-MediaWiki_1.39"><a href="/wiki/Special:MyLanguage/MediaWiki_1.39" title="Special:MyLanguage/MediaWiki 1.39">MediaWiki 1.39</a><a href="/wiki/MediaWiki_1.39" title="MediaWiki 1.39"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=5" title="Edit section: MediaWiki 1.39">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="jquery.hoverIntent" data-mw-thread-id="h-jquery.hoverIntent-MediaWiki_1.39">jquery.hoverIntent</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=6" title="Edit section: jquery.hoverIntent">edit</a>]</div> The <code>jquery.hoverIntent</code> module provides a helper method to run some code after an element was hovered for a minimum period of time. It does this by delaying your callback, such that very brief of accidental hovers don't cause a potentially "unintended" visual effect. This module is now deprecated (<a href="https://phabricator.wikimedia.org/T311194" class="extiw" title="phab:T311194">T311194</a>). There are two migration paths: <ol><li>Use the built-in jQuery <code>on()</code> function instead (with events <code>mouseenter</code> and <code>mouseleave</code>), or</li> <li>Re-create a similar effect using <code>setTimeout</code>.</li></ol> Firstly, consider whether you still need the hoverIntent logic. When we introduced hoverIntent in 2010 (with <a href="/wiki/Special:MyLanguage/MediaWiki_1.16" title="Special:MyLanguage/MediaWiki 1.16">MediaWiki 1.16</a><a href="/wiki/MediaWiki_1.16" title="MediaWiki 1.16"> </a>), there are a number of notable differences compared to today. Mobile was much less significant for gadgets and user scripts, the design and behaviour expectations were different, and performance was balanced based on different trade-offs between CPU and network cost than today. Try converting to the built-in <code>on()</code> and interact with your gadget. Documentation: <ul><li><a rel="nofollow" class="external free" href="https://api.jquery.com/on/">https://api.jquery.com/on/</a></li></ul> <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>var $btn = $( '.tpl-mybutton' ); // Old code (deprecated) $btn.hoverIntent( function () { $btn.addClass( 'tpl-my-button--active' ); }, function () { $btn.removeClass( 'tpl-my-button--active' ); } ); // Old code (deprecated) $btn.hoverIntent( { interval: 300, over: function () { $btn.addClass( 'tpl-my-button--active' ); }, out: function () { $btn.removeClass( 'tpl-my-button--active' ); } } ); // New code, with on() $btn .on( 'mouseenter', function () { $btn.addClass( 'tpl-my-button--active' ); } ) .on( 'mouseleave', function () { $btn.removeClass( 'tpl-my-button--active' ); } ); </pre></div> Does it get better without the delay? If you prefer to keep the previous behaviour, you can create a similar delaying effect with a <code>setTimeout</code> call and two local varables: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>var pending, done; $btn .on( 'mouseenter', function () { if ( pending ) { return; } pending = setTimeout( function () { $btn.addClass( 'tpl-mybutton--active' ); done = true; }, 300 ); // delay } ) .on( 'mouseleave', function () { if ( done ) { $btn.removeClass( 'tpl-mybutton--active' ); } clearTimeout( pending ); pending = done = null; } ); </pre></div> To compare the examples side-by-side refer to <a rel="nofollow" class="external free" href="https://codepen.io/Krinkle/pen/VwGWgqN">https://codepen.io/Krinkle/pen/VwGWgqN</a>. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.38" data-mw-thread-id="h-MediaWiki_1.38"><a href="/wiki/Special:MyLanguage/MediaWiki_1.38" title="Special:MyLanguage/MediaWiki 1.38">MediaWiki 1.38</a><a href="/wiki/MediaWiki_1.38" title="MediaWiki 1.38"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=7" title="Edit section: MediaWiki 1.38">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="jquery.jStorage" data-mw-thread-id="h-jquery.jStorage-MediaWiki_1.38">jquery.jStorage</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=8" title="Edit section: jquery.jStorage">edit</a>]</div> The <code>jquery.jStorage</code> module was deprecated in 2016 (MediaWiki 1.28). It has been removed in 2021 (MediaWiki 1.38). Use mw.storage from the <code>mediawiki.storage</code> module instead (<a href="https://phabricator.wikimedia.org/T143034" class="extiw" title="phab:T143034">T143034</a>). See also: <a href="https://doc.wikimedia.org/mediawiki-core/master/js/#!/api/mw.storage" class="extiw" title="wmdoc:mediawiki-core/master/js/">mw.storage</a> <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// Old (deprecated) $.jStorage.set( 'mygadget-example', simple ); // simple = 'Hello' $.jStorage.set( 'mygadget-example', object ); // object = { sub: 'Hello' } simple = $.jStorage.get( 'mygadget-example' ); object = $.jStorage.get( 'mygadget-example' ); // New (replacement) mw.storage.set( 'mygadget-example', simple ); // simple = 'Hello' mw.storage.setObject( 'mygadget-example', object ); // object = { sub: 'Hello' } simple = mw.storage.get( 'mygadget-example' ); object = mw.storage.getObject( 'mygadget-example' ) </pre></div> <div class="mw-heading mw-heading3"><h3 id="Package_Gadgets" data-mw-thread-id="h-Package_Gadgets-MediaWiki_1.38">Package Gadgets</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=9" title="Edit section: Package Gadgets">edit</a>]</div> <style data-mw-deduplicate="TemplateStyles:r6353907">.mw-parser-output .hatnote{font-style:italic;padding-bottom:0.4em;margin-bottom:0.4em;border-bottom:1px solid #ccc}.mw-parser-output .hatnote.no-border{border-bottom:none}</style><div role="note" class="hatnote">See also <a href="/wiki/Special:MyLanguage/Extension:Gadgets#Options" title="Special:MyLanguage/Extension:Gadgets">Extension:Gadgets#Options</a> and <a href="https://phabricator.wikimedia.org/T198758" class="extiw" title="phab:T198758">T198758</a>.</div> Gadgets could always have multiple files, but these were simply merged and executed as one script. MediaWiki 1.33 introduced the "<a href="/wiki/Special:MyLanguage/ResourceLoader/Package_files" title="Special:MyLanguage/ResourceLoader/Package files">Package files</a>" feature, which allows for a more modular JavaScript design, with the <code>require()</code> function and <code>module.exports</code> pattern to refer to additional files. Additionally, this allows you to include data from JSON files. This feature was limited to modules in MediaWiki core and extensions. Since MediaWiki 1.38 this feature is also supported in ResourceLoaderWikiModule, and <a href="/wiki/Special:MyLanguage/Extension:Gadgets#Options" title="Special:MyLanguage/Extension:Gadgets">the Gadgets extension</a> was updated to make use of this through a new definition option called "<code>package</code>". Administrators (eg. <a href="https://meta.wikimedia.org/wiki/Interface_administrator" class="extiw" title="m:Interface administrator">Interface administrator</a> on WMF wikis) should take care when writing or reviewing JavaScript code that creates HTML based on text from JSON pages, to escape these to avoid security problems. For example: <pre>* mygadget[ResourceLoader|package]|mygadget-main.js|mygadget-Foo.js|mygadget-data.json|mygadget.css </pre> Where MediaWiki:Gadget-mygadget-Foo.js exports: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>function Foo( config ) { // ... } Foo.prototype.format = function () { // ... }; module.exports = Foo; </pre></div> and MediaWiki:Gadget-mygadget-data.json: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>{ "setting": [ "value1", "value2" ], "flag": true } </pre></div> From <code>MediaWiki:Gadget-mygadget-main.js</code> you can then use: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>var Foo = require( './mygadget-Foo.js' ); // class Foo var flag = require( './mygadget-data.json' ).flag; // true </pre></div> Gadgets may also use <code>module.exports</code> in the main file to define a public interface that can be accessed by other gadgets with <code>require( 'ext.gadget.mygadget' )</code>, just like any other ResourceLoader module. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.37" data-mw-thread-id="h-MediaWiki_1.37"><a href="/wiki/Special:MyLanguage/MediaWiki_1.37" title="Special:MyLanguage/MediaWiki 1.37">MediaWiki 1.37</a><a href="/wiki/MediaWiki_1.37" title="MediaWiki 1.37"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=10" title="Edit section: MediaWiki 1.37">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="jQuery_Migrate_3" data-mw-thread-id="h-jQuery_Migrate_3-MediaWiki_1.37">jQuery Migrate 3</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=11" title="Edit section: jQuery Migrate 3">edit</a>]</div> <a href="/wiki/Special:MyLanguage/jQuery" title="Special:MyLanguage/jQuery">JQuery</a><a href="/wiki/JQuery" title="JQuery"> </a> was upgraded to version 3 in MediaWiki 1.29 (released in 2017). In jQuery 3.0, several deprecated features were removed by upstream. We temporarily added these back through the jQuery Migrate layer to allow for a gradual transition (<a href="https://phabricator.wikimedia.org/T280944" class="extiw" title="phab:T280944">T280944</a>). In the developer console, you may find warnings like the following: <blockquote> JQMIGRATE: jQuery.fn.size() is deprecated and removed; use the .length property. JQMIGRATE: Attribute selector with '#' must be quoted </blockquote> You may also find warnings that only say that something "is deprecated" without "and removed", such as: <blockquote>JQMIGRATE: jQuery.fn.bind() is deprecated</blockquote> Warnings that only say "deprecated" are for features that will continue to work even after the jQuery 3 migration layer is removed. To understand how to update your code, use the following manuals: <ul><li><a rel="nofollow" class="external text" href="https://github.com/jquery/jquery-migrate/blob/3.3.2/warnings.md">jQuery Migrate 3 warnings reference</a></li> <li><a rel="nofollow" class="external text" href="https://jquery.com/upgrade-guide/3.0/">jQuery 3.0 Upgrade Guide</a></li> <li><a rel="nofollow" class="external text" href="https://jquery.com/upgrade-guide/3.5/">jQuery 3.5 Upgrade Guide</a></li></ul> The following three issues may be difficult to find and have some extra tips: <ul><li><a rel="nofollow" class="external text" href="https://jquery.com/upgrade-guide/3.5/#description-of-the-change">HTML tags must be properly nested</a>: This means you have used an invalid shortcut like <code><div/></code>. In older jQuery versions, this invalid HTML was automatically corrected to <div>, followed by . In jQuery 3 the browser standard behaviour is followed, which means this becomes a inside a <div> like <code><div>..</div></code>. To preserve the old behaviour, explicitly open and close your HTML. Like <code><div> </div> </code>.</li> <li><a rel="nofollow" class="external text" href="https://jquery.com/upgrade-guide/3.0/#breaking-change-cross-domain-script-requests-must-be-declared">Cross-domain AJAX request with JSON-P</a>: If you may cross-domain requests with <code>$.ajax()</code> or <code>$.get()</code> to APIs that returns executable JSON-P scripts (instead of plain JSON), then you must add the <code>{ dataType: "script" }</code> option. In previous versions, jQuery would guess between secure JSON and insecure JSON-P scripts.</li> <li><a rel="nofollow" class="external text" href="https://jquery.com/upgrade-guide/3.0/#breaking-change-load-unload-and-error-removed">Calling .load() as event method</a>: It is no longer possible to call <code>$img.load(function)</code>. Use <code>$img.on("load", function)</code> instead.</li></ul> <div class="mw-heading mw-heading4"><h4 id="$wgIncludejQueryMigrate" data-mw-thread-id="h-$wgIncludejQueryMigrate-jQuery_Migrate_3">$wgIncludejQueryMigrate</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=12" title="Edit section: $wgIncludejQueryMigrate">edit</a>]</div> As site administrator running MediaWiki 1.35.3 or later, you can choose to turn off migrate layer today already by setting <code><a href="/wiki/Special:MyLanguage/Manual:$wgIncludejQueryMigrate" title="Special:MyLanguage/Manual:$wgIncludejQueryMigrate">$wgIncludejQueryMigrate</a><a href="/wiki/Manual:$wgIncludejQueryMigrate" title="Manual:$wgIncludejQueryMigrate"> </a></code> to <code>false</code>. Turning off the migration layer improves page load performance, and helps you to verify whether your extensions and gadgets are ready for the upgrade. For example, if you have old code still using methods that were removed in jQuery 3, this may fail as follows. <blockquote> Uncaught TypeError: $elem.size is not a function. </blockquote> In MediaWiki 1.37, the migration layer will be off by default. A site administrator may temporarily turn it back on until problems like the above are resolved. In MediaWiki 1.38, the migration layer will be permanently removed. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.36" data-mw-thread-id="h-MediaWiki_1.36"><a href="/wiki/Special:MyLanguage/MediaWiki_1.36" title="Special:MyLanguage/MediaWiki 1.36">MediaWiki 1.36</a><a href="/wiki/MediaWiki_1.36" title="MediaWiki 1.36"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=13" title="Edit section: MediaWiki 1.36">edit</a>]</div> This version is not supported. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.35" data-mw-thread-id="h-MediaWiki_1.35"><a href="/wiki/Special:MyLanguage/MediaWiki_1.35" title="Special:MyLanguage/MediaWiki 1.35">MediaWiki 1.35</a><a href="/wiki/MediaWiki_1.35" title="MediaWiki 1.35"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=14" title="Edit section: MediaWiki 1.35">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="user.tokens_module" data-mw-thread-id="h-user.tokens_module-MediaWiki_1.35">user.tokens module</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=15" title="Edit section: user.tokens module">edit</a>]</div> The <code>user.tokens</code> module has been merged into the <code>user.options</code> module bundle. The old module name is now an alias and has been deprecated in MediaWiki 1.35. It will be removed in MediaWiki 1.36 sometime later in 2020. – <a href="https://phabricator.wikimedia.org/T235457" class="extiw" title="phab:T235457">T235457</a> To remain compatible, update dependency lists or loader statements from "<code>user.tokens</code>" to "<code>user.options</code>". <div class="mw-heading mw-heading3"><h3 id="mediawiki.notify" data-mw-thread-id="h-mediawiki.notify-MediaWiki_1.35">mediawiki.notify</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=16" title="Edit section: mediawiki.notify">edit</a>]</div> The <code>mediawiki.notify</code> module has been merged into the MediaWiki base environment. This module was responsible for providing the <code>mw.notify()</code> function, which in turn lazy-loads the larger <code>mediawiki.notification</code> module. – <a href="https://phabricator.wikimedia.org/T233676" class="extiw" title="phab:T233676">T233676</a> To remain compatible, simply remove "<code>mediawiki.notify</code>" from any dependency lists or loader statements. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.34" data-mw-thread-id="h-MediaWiki_1.34"><a href="/wiki/Special:MyLanguage/MediaWiki_1.34" title="Special:MyLanguage/MediaWiki 1.34">MediaWiki 1.34</a><a href="/wiki/MediaWiki_1.34" title="MediaWiki 1.34"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=17" title="Edit section: MediaWiki 1.34">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="Module_deprecations" data-mw-thread-id="h-Module_deprecations-MediaWiki_1.34">Module deprecations</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=18" title="Edit section: Module deprecations">edit</a>]</div> <div class="mw-heading mw-heading4"><h4 id="jquery.ui.*" data-mw-thread-id="h-jquery.ui.*-Module_deprecations">jquery.ui.*</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=19" title="Edit section: jquery.ui.*">edit</a>]</div> jQuery UI has been deprecated for years, but remains available due to slow switching to alternatives. As a part of <a rel="nofollow" class="external text" href="https://timotijhof.net/posts/2019/wikipedia-javascript-on-budget/">on-going efforts to reduce bandwidth cost</a>, the 27 deprecated jQuery UI modules have been collapsed into a single, still-deprecated mega-module (<a href="https://gerrit.wikimedia.org/r/q/I9070ad9052319f5ca2bc67e0ffaf502db0f13ceb" class="extiw" title="gerrit:q/I9070ad9052319f5ca2bc67e0ffaf502db0f13ceb">Gerrit</a>, <a href="https://phabricator.wikimedia.org/T219604" class="extiw" title="phab:T219604">T219604</a>). To remain compatible, update dependency lists and loader statements from "<code>jquery.ui.*</code>" to "<code>jquery.ui</code>". <div class="mw-heading mw-heading4"><h4 id="accessKeyLabel" data-mw-thread-id="h-accessKeyLabel-Module_deprecations">accessKeyLabel</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=20" title="Edit section: accessKeyLabel">edit</a>]</div> The <code>jquery.accessKeyLabel</code> plugin has been available through <code>mediawiki.util</code> since 2014 (MediaWiki 1.24). Depending on it directly is no longer supported as of MediaWiki 1.34 Update dependency lists and loader statements from "jquery.accessKeyLabel" to "mediawiki.util" to remain compatible. <div class="mw-heading mw-heading4"><h4 id="mediawiki.RegExp" data-mw-thread-id="h-mediawiki.RegExp-Module_deprecations">mediawiki.RegExp</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=21" title="Edit section: mediawiki.RegExp">edit</a>]</div> The <code>mediawiki.RegExp</code> module has been available through <code>mediawiki.util</code> since 2015 (MediaWiki 1.25). – <a href="https://phabricator.wikimedia.org/T218339" class="extiw" title="phab:T218339">T218339</a> Depending on it directly is no longer supported as of MediaWiki 1.34. Update dependency lists and loader statements from "mediawiki.RegExp" to "mediawiki.util" to remain compatible. The <code>mw.RegExp.escape()</code> function has also been deprecated (although kept as alias, shipping with "mediawiki.util"). Replace usage with <code>mw.util.escapeRegExp()</code>. <div class="mw-heading mw-heading4"><h4 id="jquery.tabIndex" data-mw-thread-id="h-jquery.tabIndex-Module_deprecations">jquery.tabIndex</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=22" title="Edit section: jquery.tabIndex">edit</a>]</div> The <code>jquery.tabIndex</code> module existed to help compute a low or high tab index on focusable elements on a page. In most cases this code was redundant. Lines of code involving <code>firstTabIndex()</code> or <code>lastTabIndex()</code> are often best removed entirely. The module is deprecated in MediaWiki 1.34. <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// Simply remove $thing.attr( 'tabindex', $( document ).lastTabIndex() + 1 ); </pre></div> If the effect of this code is still wanted, it can be achieved in a simpler way without this JavaScript plugin. For example, to set a low tabindex, use <code>tabindex="0"</code>. <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// Remove $thing.attr( 'tabindex', $( document ).firstTabIndex() ); // Add $thing.attr( 'tabindex', '0' ); </pre></div> Or, to set a high tabindex, use <code>tabindex="999"</code> instead, like so: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// Remove $thing.attr( 'tabindex', $( document ).lastTabIndex() + 1 ); // Add $thing.attr( 'tabindex', '999' ); </pre></div> If you do need the exact behaviour of the original <code>lastTabIndex</code> function, use the following: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// Remove $thing.attr( 'tabindex', $( document ).lastTabIndex() + 1 ); // Add var lastIndex = Math.max.apply(null, $.map($('[tabindex]'), function (el) { return +el.tabIndex; })); $thing.attr( 'tabindex', lastIndex + 1 ); </pre></div> <div class="mw-heading mw-heading3"><h3 id="mw.user.tokens_editToken" data-mw-thread-id="h-mw.user.tokens_editToken-MediaWiki_1.34">mw.user.tokens <code>editToken</code></h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=23" title="Edit section: mw.user.tokens editToken">edit</a>]</div> The <code>editToken</code> key of <code>mw.user.tokens</code> was deprecated in 2016 (MediaWiki 1.26). It has been removed in 2019 (MediaWiki 1.34). – <a href="https://phabricator.wikimedia.org/T233442" class="extiw" title="phab:T233442">T233442</a> The <code>csrfToken</code> key should be used instead. For example, change <code>mw.user.tokens.get('editToken')</code> to <code>mw.user.tokens.get('csrfToken')</code>. Note: The <code>mw.Api</code> class has not changed. Code like <code>mw.Api.getToken('edit')</code> will continue to work and should not be changed. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.32" data-mw-thread-id="h-MediaWiki_1.32"><a href="/wiki/Special:MyLanguage/MediaWiki_1.32" title="Special:MyLanguage/MediaWiki 1.32">MediaWiki 1.32</a><a href="/wiki/MediaWiki_1.32" title="MediaWiki 1.32"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=24" title="Edit section: MediaWiki 1.32">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="Api_modules" data-mw-thread-id="h-Api_modules-MediaWiki_1.32">Api modules</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=25" title="Edit section: Api modules">edit</a>]</div> All submodules <code>mediawiki.api.*</code> have been merged into the main module <a href="/wiki/Special:MyLanguage/ResourceLoader/Core_modules#mediawiki.api" title="Special:MyLanguage/ResourceLoader/Core modules">mediawiki.api</a><a href="/wiki/ResourceLoader/Core_modules#mediawiki.api" title="ResourceLoader/Core modules"> </a>, so you only have to require the main module, and requiring submodules emits deprecation warnings. These submodules were kept as deprecated aliases to <code>mediawiki.api</code>, and removed in MediaWiki 1.33. <div class="mw-heading mw-heading3"><h3 id="wikiGetlink" data-mw-thread-id="h-wikiGetlink-MediaWiki_1.32"><code>wikiGetlink</code></h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=26" title="Edit section: wikiGetlink">edit</a>]</div> Method <code>mw.util.wikiGetlink()</code>, which was deprecated since MediaWiki 1.23, has been removed. Use <code><a href="/wiki/ResourceLoader/Core_modules#mw.util.getUrl" title="ResourceLoader/Core modules">mw.util.getUrl()</a></code> instead. <div class="mw-heading mw-heading3"><h3 id="wgEnableAPI" data-mw-thread-id="h-wgEnableAPI-MediaWiki_1.32">wgEnableAPI</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=27" title="Edit section: wgEnableAPI">edit</a>]</div> The <code>wgEnableAPI</code> and <code>wgEnableWriteAPI</code> keys of mw.config are deprecated as of MediaWiki 1.32, and will be removed in MediaWiki 1.35 (<a href="https://gerrit.wikimedia.org/r/504076" class="extiw" title="gerrit:504076">change</a>). The value of these configuration keys is always <code>true</code>. Any check for them in JavaScript code is redundant and can be safely removed. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.31" data-mw-thread-id="h-MediaWiki_1.31"><a href="/wiki/Special:MyLanguage/MediaWiki_1.31" title="Special:MyLanguage/MediaWiki 1.31">MediaWiki 1.31</a><a href="/wiki/MediaWiki_1.31" title="MediaWiki 1.31"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=28" title="Edit section: MediaWiki 1.31">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="Internet_Explorer_10_browser" data-mw-thread-id="h-Internet_Explorer_10_browser-MediaWiki_1.31">Internet Explorer 10 browser</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=29" title="Edit section: Internet Explorer 10 browser">edit</a>]</div> With this version, we have stopped JavaScript support for IE10. See <a href="/wiki/Compatibility#Browsers" title="Compatibility">Compatibility</a> for details. <div class="mw-heading mw-heading3"><h3 id="jquery.placeholder" data-mw-thread-id="h-jquery.placeholder-MediaWiki_1.31">jquery.placeholder</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=30" title="Edit section: jquery.placeholder">edit</a>]</div> Deprecated in MediaWiki 1.29 (<a href="https://gerrit.wikimedia.org/r/341845" class="extiw" title="gerrit:341845">change</a>), removed in MediaWiki 1.31. The shim for the native placeholder attribute became obsolete as all <a href="/wiki/Compatibility" title="Compatibility">supported browsers</a> for JavaScript support this natively. Simply remove the call to <code>.placeholder()</code>. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.30" data-mw-thread-id="h-MediaWiki_1.30"><a href="/wiki/Special:MyLanguage/MediaWiki_1.30" title="Special:MyLanguage/MediaWiki 1.30">MediaWiki 1.30</a><a href="/wiki/MediaWiki_1.30" title="MediaWiki 1.30"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=31" title="Edit section: MediaWiki 1.30">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="jquery.mwExtension" data-mw-thread-id="h-jquery.mwExtension-MediaWiki_1.30"><code>jquery.mwExtension</code></h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=32" title="Edit section: jquery.mwExtension">edit</a>]</div> The functionality was originally provided by a module called <code>jquery.mwPrototypes</code> in MediaWiki 1.17 (<a href="https://www.mediawiki.org/wiki/Special:Code/MediaWiki/76320" class="extiw" title="rev:76320">r76320</a>). This was renamed to <code>jquery.mwExtension</code> in MediaWiki 1.19 (<a href="https://www.mediawiki.org/wiki/Special:Code/MediaWiki/94227" class="extiw" title="rev:94227">r94227</a>). The module was deprecated in MediaWiki 1.26, and removed in MediaWiki 1.30. <ul><li><code>$.trimLeft</code>, <code>$.trimRight</code>: These have native JavaScript methods available now.</li> <li><code>$.ucFirst</code>: No replacement, rarely used. Simple enough to do in plain JavaScript as <code>str[0].toUpperCase + str.slice(1)</code>.</li> <li><code>$.escapeRE</code>: Moved to <a href="/wiki/ResourceLoader/Core_modules#mediawiki.RegExp" title="ResourceLoader/Core modules">mediawiki.RegExp</a>; later <a href="#mediawiki.RegExp">moved to <code>mediawiki.util</code></a>.</li> <li><code>$.isDomElement</code>: No replacement, rarely used. Use duck-type checks like <code>!!obj.nodeType</code> instead.</li> <li><code>$.compareArray, $.compareObject, $.isEmpty</code>: No replacement, rarely used.</li></ul> <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.29" data-mw-thread-id="h-MediaWiki_1.29"><a href="/wiki/Special:MyLanguage/MediaWiki_1.29" title="Special:MyLanguage/MediaWiki 1.29">MediaWiki 1.29</a><a href="/wiki/MediaWiki_1.29" title="MediaWiki 1.29"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=33" title="Edit section: MediaWiki 1.29">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="Legacy_removals" data-mw-thread-id="h-Legacy_removals-MediaWiki_1.29">Legacy removals</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=34" title="Edit section: Legacy removals">edit</a>]</div> JavaScript functions and variables part of <code>wikibits.js</code> that had been deprecated since MediaWiki 1.17 or 1.18 have been removed: User-Agent variables: <code>is_gecko, is_chrome_mac, is_chrome, webkit_version, is_safari_win, is_safari, webkit_match, is_ff2, ff2_bugs, is_ff2_win, is_ff2_x11, opera95_bugs, opera7_bugs, opera6_bugs, is_opera_95, is_opera_preseven, is_opera, ie6_bugs, clientPC</code>. DOM manipulation: <code>changeText, killEvt, addHandler, hookEvent, addClickHandler, removeHandler, getElementsByClassName, getInnerText</code>. Utilities: <code>setupCheckboxShiftClick, addCheckboxClickHandlers, mwEditButtons, mwCustomEditButtons, injectSpinner, removeSpinner, escapeQuotes, escapeQuotesHTML, jsMsg, addPortletLink, appendCSS, tooltipAccessKeyPrefix, tooltipAccessKeyRegexp, updateTooltipAccessKeys</code>. <div class="mw-heading mw-heading4"><h4 id="How_to_migrate" data-mw-thread-id="h-How_to_migrate-Legacy_removals">How to migrate</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=35" title="Edit section: How to migrate">edit</a>]</div> Below is a table containing migration information for the wikibits functionality. Many of the replacements are part of the <code>mediawiki.util</code> module, which <a href="#Legacy_default:_mediawiki.util">is not loaded by default</a>. Please declare your dependency on this module if you refer to <code>mw.util</code>, as described in <a href="/wiki/ResourceLoader/Developing_with_ResourceLoader#Client-side_(dynamically)" title="ResourceLoader/Developing with ResourceLoader">the development guide</a>. <table class="wikitable plainlinks"> <tbody><tr> <th>Identifier </th> <th>Type </th> <th>Replaced by </th></tr> <tr> <td>clientPC</td> <td>string</td> <td> » <code><a href="https://developer.mozilla.org/docs/Web/API/NavigatorID/userAgent" class="extiw" title="devmo:Web/API/NavigatorID/userAgent">navigator.userAgent</a></code> </td></tr> <tr> <td>is_gecko</td> <td>boolean</td> <td rowspan="9"> » <a href="/wiki/ResourceLoader/Default_modules#jquery.client" class="mw-redirect" title="ResourceLoader/Default modules">jQuery.client</a> </td></tr> <tr> <td>is_safari</td> <td>boolean </td></tr> <tr> <td>is_safari_win</td> <td>boolean </td></tr> <tr> <td>is_chrome</td> <td>boolean </td></tr> <tr> <td>is_chrome_mac</td> <td>boolean </td></tr> <tr> <td>is_ff2</td> <td>boolean </td></tr> <tr> <td>is_ff2_win</td> <td>boolean </td></tr> <tr> <td>is_ff2_x11</td> <td>boolean </td></tr> <tr> <td>webkit_match</td> <td>object </td></tr> <tr> <td>ff2_bugs</td> <td>boolean</td> <td rowspan="2"> obsolete </td></tr> <tr> <td>ie6_bugs</td> <td>boolean </td></tr> <tr> <td>doneOnloadHook</td> <td>boolean</td> <td rowspan="4"> » <a href="/wiki/ResourceLoader/Core_modules#mw.hook" title="ResourceLoader/Core modules">mw.hook</a> » jQuery Use <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>$( function () { /* place code here to be executed after the page is loaded */ } ); // or: function LoadMyApp() { /* place code here to be executed after the page is loaded */ } $( LoadMyApp ); </pre></div> </td></tr> <tr> <td>onloadFuncts</td> <td>object </td></tr> <tr> <td>addOnloadHook</td> <td>function </td></tr> <tr> <td>runOnloadHook</td> <td>function </td></tr> <tr> <td>killEvt</td> <td>function</td> <td> » <a rel="nofollow" class="external text" href="http://api.jquery.com/category/events/event-object/">jQuery.Event</a>: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>/** * @param e {jQuery.Event} Cross-browser compatible/normalized event object */ $( '#mw-fooBar' ).click( function( e ) { e.preventDefault(); /* do something else */ } ); </pre></div> </td></tr> <tr> <td>loadedScripts</td> <td>object</td> <td>redundant </td></tr> <tr> <td>importScriptURI</td> <td>function</td> <td rowspan="2"> » <a href="/wiki/ResourceLoader/Default_modules#mw.loader" class="mw-redirect" title="ResourceLoader/Default modules">mw.loader</a> <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// Full script url mw.loader.load( 'https://www.mediawiki.org/w/index.php?title=MediaWiki:Gadget-UTCLiveClock.js&action=raw&ctype=text/javascript' ); // Local script url mw.loader.load( '/w/index.php?title=MediaWiki:Gadget-HotCat.js&action=raw&ctype=text/javascript' ); // Full stylesheet url mw.loader.load( 'https://www.mediawiki.org/w/index.php?title=User:Example/custom-foo.css&action=raw&ctype=text/css', 'text/css' ); // Local stylesheet mw.loader.load( '/w/index.php?title=User:Example/custom-foo.css&action=raw&ctype=text/css', 'text/css' ); </pre></div> </td></tr> <tr> <td>importStylesheetURI</td> <td>function </td></tr> <tr> <td>appendCSS</td> <td>function</td> <td>» <a href="/wiki/ResourceLoader/Default_modules#addCSS" class="mw-redirect" title="ResourceLoader/Default modules">mw.util.addCSS</a> </td></tr> <tr> <td>addHandler</td> <td>function</td> <td rowspan="4"> » jQuery Events Using <code>.<a rel="nofollow" class="external text" href="http://api.jquery.com/on/">on()</a></code> one can add event handlers. Some of the more common events have their own shortcuts (such as <code>.<a rel="nofollow" class="external text" href="http://api.jquery.com/click/">click()</a></code>). <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// Attach multiple events to an element and attach an anonymous function $( '#fooBar' ).on( 'mouseenter mouseleave', function() { alert( '#fooBar is moused!' ); } ); // Attach multiple events with different handlers to a single element $( '#fooBar' ).on( { click: function() { // do something on click }, mouseenter: function() { // do something on mouseenter } } ); // Attach a handler to the click events of an earlier defined DOM element $( myElement ).click( myFunction ); </pre></div> </td></tr> <tr> <td>addClickHandler</td> <td>function </td></tr> <tr> <td>removeHandler</td> <td>function </td></tr> <tr> <td>hookEvent</td> <td>function </td></tr> <tr> <td>mwEditButtons</td> <td>object</td> <td>obsolete </td></tr> <tr> <td>mwCustomEditButtons</td> <td>object</td> <td> » WikiEditor The new WikiEditor (which also works fine in Monobook, see <a class="external text" href="https://www.mediawiki.org/w/index.php?title=Project:Sandbox&action=edit&useskin=monobook">here</a>) has built-in function to customize the toolbar. For more info see <a href="/wiki/Extension:WikiEditor/Toolbar_customization" title="Extension:WikiEditor/Toolbar customization">Extension:WikiEditor/Toolbar customization</a>. For examples to insert buttons using the native script see <a href="/wiki/Extension:WikiEditor/Toolbar_customization/Library" title="Extension:WikiEditor/Toolbar customization/Library">Extension:WikiEditor/Toolbar customization/Library</a>. For a script to insert buttons using a simple syntax similar to the old way check out <a href="https://meta.wikimedia.org/wiki/User:Krinkle/Scripts/insertVectorButtons#Description" class="extiw" title="meta:User:Krinkle/Scripts/insertVectorButtons">meta:User:Krinkle/Scripts/insertVectorButtons#Description</a> <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>mw.loader.load( '//meta.wikimedia.org/w/index.php?title=User:Krinkle/insertVectorButtons.js' + '&action=raw&ctype=text/javascript' ); function kCustomMainInsertButton_config(){ // {{Welcome}} ~~~~ kCustomMainInsertButton( 'welcome', // Id '//commons.wikimedia.org/w/thumb.php?f=Nuvola_apps_edu_languages.svg&w=22', // File 'Welcome', // tooltip '{\{Welcome}\}\~\~\~\~', // Open tag '', // Close tag '' // sampleText ); // {{subst:Test2}} ~~~~ kCustomMainInsertButton( 'test2', // Id '//commons.wikimedia.org/w/thumb.php?f=Nuvola_apps_important.svg&w=22', // File 'Test2', // tooltip '{\{subst:test2|', // Open tag '}\}\~\~\~\~', // Close tag '' // sample text ); } </pre></div> </td></tr> <tr> <td>tooltipAccessKeyPrefix</td> <td>string</td> <td rowspan="3">» <a href="/wiki/ResourceLoader/Default_modules#jquery.accessKeyLabel" class="mw-redirect" title="ResourceLoader/Default modules">jquery.accessKeyLabel</a> <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// myElement.accessKey = 'x'; // myElement.title = 'Example [x]'; mw.loader.using('jquery.accessKeyLabel').then(function () { $(myElement).updateTooltipAccessKeys(); }); </pre></div> </td></tr> <tr> <td>tooltipAccessKeyRegexp</td> <td>object </td></tr> <tr> <td> updateTooltipAccessKeys</td> <td>function </td></tr> <tr> <td>ta</td> <td>object</td> <td><a class="external text" href="https://www.mediawiki.org/w/index.php?title=Special:AllMessages&prefix=accesskey-">MediaWiki:Accesskey-*</a> and <a class="external text" href="https://www.mediawiki.org/w/index.php?title=Special:AllMessages&prefix=tooltip-">MediaWiki:Tooltip-*</a>. </td></tr> <tr> <td>akeytt</td> <td>function</td> <td>obsolete </td></tr> <tr> <td>checkboxes</td> <td>object</td> <td rowspan="5"> » <a href="/wiki/ResourceLoader/Default_modules#jquery.checkboxShiftClick" class="mw-redirect" title="ResourceLoader/Default modules">jquery.checkboxShiftClick</a> </td></tr> <tr> <td>lastCheckbox</td> <td>object </td></tr> <tr> <td>setupCheckboxShiftClick</td> <td>function </td></tr> <tr> <td>addCheckboxClickHandlers</td> <td>function </td></tr> <tr> <td>checkboxClickHandler</td> <td>function </td></tr> <tr> <td>showTocToggle</td> <td>function</td> <td rowspan="2"> </td></tr> <tr> <td>toggleToc</td> <td>function </td></tr> <tr> <td>ts_image_path</td> <td>string</td> <td rowspan="19"> » <a href="/wiki/RL/DM#jquery.tablesorter" class="mw-redirect" title="RL/DM">jquery.tablesorter</a> </td></tr> <tr> <td>ts_image_up</td> <td>string </td></tr> <tr> <td>ts_image_down</td> <td>string </td></tr> <tr> <td>ts_image_none</td> <td>string </td></tr> <tr> <td>ts_europeandate</td> <td>boolean </td></tr> <tr> <td>ts_alternate_row_colors</td> <td>boolean </td></tr> <tr> <td>ts_number_transform_table</td> <td>object </td></tr> <tr> <td>ts_number_regex</td> <td>object </td></tr> <tr> <td>sortables_init</td> <td>function </td></tr> <tr> <td>ts_makeSortable</td> <td>function </td></tr> <tr> <td>ts_getInnerText</td> <td>function </td></tr> <tr> <td>ts_resortTable</td> <td>function </td></tr> <tr> <td>ts_initTransformTable</td> <td>function </td></tr> <tr> <td>ts_toLowerCase</td> <td>function </td></tr> <tr> <td>ts_dateToSortKey</td> <td>function </td></tr> <tr> <td>ts_parseFloat</td> <td>function </td></tr> <tr> <td>ts_currencyToSortKey</td> <td>function </td></tr> <tr> <td>ts_sort_generic</td> <td>function </td></tr> <tr> <td>ts_alternate</td> <td>function </td></tr> <tr> <td>changeText</td> <td>function</td> <td rowspan="2"> » jQuery Using <code><a rel="nofollow" class="external text" href="https://api.jquery.com/text/">.text()</a></code> one can get (or set) the text content of an element: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// Set text of an earlier defined element $( myElement ).text( 'New text!' ); // Set text for multiple elements at once $( '.mw-userlink' ).text( 'Mr. Foobar' ); // Get the text of an element $( myElement ).text(); </pre></div> </td></tr> <tr> <td>getInnerText</td> <td>function </td></tr> <tr> <td>escapeQuotes</td> <td>function</td> <td> </td></tr> <tr> <td>escapeQuotesHTML</td> <td>function</td> <td> » <a href="/wiki/ResourceLoader/Default_modules#mw.html" class="mw-redirect" title="ResourceLoader/Default modules">mw.html</a> </td></tr> <tr> <td>addPortletLink</td> <td>function</td> <td> » <a href="/wiki/ResourceLoader/Default_modules#addPortletLink" class="mw-redirect" title="ResourceLoader/Default modules">mw.util.addPortletLink</a> </td></tr> <tr> <td>jsMsg</td> <td>function</td> <td> » <a href="/wiki/ResourceLoader/Default_modules#jsMessage" class="mw-redirect" title="ResourceLoader/Default modules">mw.util.jsMessage</a> </td></tr> <tr> <td>injectSpinner</td> <td>function</td> <td rowspan="2"> » <a href="/wiki/ResourceLoader/Default_modules#jquery.spinner" class="mw-redirect" title="ResourceLoader/Default modules">jquery.spinner</a> (<a href="https://doc.wikimedia.org/mediawiki-core/master/js/#!/api/jQuery.plugin.spinner" class="extiw" title="wmdoc:mediawiki-core/master/js/">Documentation</a>) <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>jQuery( .. ).injectSpinner('some-id'); jQuery.removeSpinner('some-id'); </pre></div> </td></tr> <tr> <td>removeSpinner</td> <td>function </td></tr> <tr> <td>getElementsByClassName</td> <td>function</td> <td> » jQuery Use the CSS Selector in jQuery to select elements by classname. Here examples for the three most common usecases of <code>getElementsByClassName()</code>: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// Get everything with a classname $( '.myclass' ); // Get all of element X (ie. table) with a classname $( 'table.wikitable' ); // Get all of something within another element $( myDomElement ).find( '.myclass' ); $( myDomElement ).find( '> .myclass' ); // only direct children // Get all class-elements that are direct children of an element $( '#someElement .myclass' ); $( '#someElement > .myclass' ); // only direct children </pre></div> </td></tr> <tr> <td>redirectToFragment</td> <td>function</td> <td> </td></tr></tbody></table> <div class="mw-heading mw-heading3"><h3 id="Gadget_type" data-mw-thread-id="h-Gadget_type-MediaWiki_1.29">Gadget type</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=36" title="Edit section: Gadget type">edit</a>]</div> <link rel="mw-deduplicated-inline-style" href="mw-data:TemplateStyles:r6353907"><div role="note" class="hatnote">See also <a href="https://phabricator.wikimedia.org/T42284" class="extiw" title="phab:T42284">T42284</a>.</div> <div class="mw-heading mw-heading4"><h4 id="Background" data-mw-thread-id="h-Background-Gadget_type">Background</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=37" title="Edit section: Background">edit</a>]</div> Since early 2011, gadgets with styles (both "only styles" and "styles and scripts") had their styles loaded twice. <a href="https://phabricator.wikimedia.org/T42284" class="extiw" title="phab:T42284">T42284</a> and <a href="https://gerrit.wikimedia.org/r/308096" class="extiw" title="gerrit:308096">change 308096</a> fix this bug. <div class="mw-heading mw-heading4"><h4 id="What's_new" data-mw-thread-id="h-What's_new-Gadget_type">What's new</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=38" title="Edit section: What's new">edit</a>]</div> This bug was addressed by adding support in the Gadgets extension for the ResourceLoader "type" feature. This allows gadget developers to configure how the module should be loaded <ul><li>type=styles: Load module styles via <code class="mw-highlight mw-highlight-lang-html mw-content-ltr" dir="ltr"><link rel="stylesheet"></code>, and completely omits loading any JavaScript files. (Loads styles early, applies styles before skin and page are ready, also works when JavaScript is disabled.)</li> <li>type=general: Load module scripts and/or styles via <code>mw.loader.load()</code>. (Applies styles after the skin and page are ready, right before JS execution, has better caching.)</li></ul> Gadgets with only styles, internally get <code>type=styles</code> by default. Gadgets with only scripts default to <code>type=general</code>. Before MediaWiki 1.30, Gadgets with both scripts and styles defaulted to loading both ways, thus loading the styles portion twice. Before that, we sent a warning in the browser console in a transition period that asked developers to set the desired type. After the transition period, we made <code>type=general</code> the default for gadgets that have both scripts and styles. To load styles through the <code>type=styles</code> system, while also loading JavaScript files, two separate gadget definitions need to be specified. <div class="mw-heading mw-heading4"><h4 id="How_to_migrate_2" data-mw-thread-id="h-How_to_migrate_2-Gadget_type">How to migrate</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=39" title="Edit section: How to migrate">edit</a>]</div> <style data-mw-deduplicate="TemplateStyles:r6651107">.mw-parser-output .note{background-position:left 7px top 50%;padding:0.5em 0.5em 0.5em 40px;margin:0.5em 0;overflow:hidden;background-color:#f8f9fa;color:#333;background-repeat:no-repeat;border:1px solid #ddd}.mw-parser-output .note-inline{display:inline-block;vertical-align:middle}.mw-parser-output .note-info{background-color:#eaf3ff;color:#333;background-image:url("https://upload.wikimedia.org/wikipedia/commons/e/ec/OOjs_UI_icon_information-progressive.svg");background-size:25px;border-color:#a3caff;padding-left:40px;min-height:25px}.mw-parser-output .note-reminder{background-color:#fff9ea;color:#333;background-image:url("https://upload.wikimedia.org/wikipedia/commons/a/a8/OOjs_UI_icon_lightbulb-yellow.svg");background-size:25px;border-color:#fc3;min-height:25px}.mw-parser-output .note-warn{background-color:#fff9ea;color:#333;background-image:url("https://upload.wikimedia.org/wikipedia/commons/3/3b/OOjs_UI_icon_alert-warning.svg");background-size:25px;border-color:#fc3;min-height:25px}.mw-parser-output .note-error{background-color:#fee7e6;color:#333;background-image:url("https://upload.wikimedia.org/wikipedia/commons/b/bf/OOjs_UI_icon_notice-destructive.svg");background-size:25px;border-color:#c33;min-height:25px}@media screen{html.skin-theme-clientpref-night .mw-parser-output .note{background-color:transparent;color:inherit}}@media screen and (prefers-color-scheme:dark){html.skin-theme-clientpref-os .mw-parser-output .note{background-color:transparent;color:inherit}}</style><div role="note" class="note note-reminder">Gadget "mygadget" styles loaded twice. Migrate to <code>type=general</code>. See <a class="external free" href="https://phabricator.wikimedia.org/T42284">https://phabricator.wikimedia.org/T42284</a>.</div> If you see this warning, that means your gadget contains both scripts and styles. Here are two ways to fix the warning: <ol><li>If the styles in your gadget are there to provide styling for things created by the gadget, add "<code>type=general</code>" to your gadget definition ("MediaWiki:Gadgets-definition").</li> <li>Or – If the styles in your gadget are there to provide styling for things that are part of the skin or on the page, then these styles should not be together with the scripts in the same gadget. Convert the gadget to two separate gadgets. One gadget that is styles-only, and the other with the scripts. If the scripts gadget also has its own styles, then also set "<code>type=general</code>" on the original gadget (per point 1). If you want to keep presenting the modules as one gadget on the Preferences page, use <a href="#Gadget_peers">#Gadget peers</a>.</li></ol> As you can see, in most cases the solution is "type=general." And in the future, this will become the default and we will not load styles twice. Right now, loading twice remains the default for compatibility with older gadgets covered by point 2 above. Changing these mixed gadgets to type=general now would cause some styles to load too late and cause a "flash of unstyled content". <div class="mw-heading mw-heading3"><h3 id="Gadget_peers" data-mw-thread-id="h-Gadget_peers-MediaWiki_1.29">Gadget peers</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=40" title="Edit section: Gadget peers">edit</a>]</div> <link rel="mw-deduplicated-inline-style" href="mw-data:TemplateStyles:r6353907"><div role="note" class="hatnote">See also <a href="https://phabricator.wikimedia.org/T42284" class="extiw" title="phab:T42284">T42284</a>.</div>For a long time, gadget authors have been interested in being able to provide a visual enhancement for all pages and also accompanying some scripting logic to apply related changes to interactive interfaces created by other modules. This requires the gadget to have both scripts and styles, but most of the styles are not required by the scripts – rather, the styles should apply directly to the page without waiting for JavaScript. So far this required either creating two gadgets (and requiring users to enable both), or creating a single gadget with the downside of the styles applying slightly after the page loads. To accommodate the use case of a single gadget providing both page styles (which don't depend on JavaScript) and JavaScript code with its own styles, a new setting was introduced: <code>peers</code>. This is similar to <code>dependencies</code>, except that where dependencies load before the main module (not before the page itself), peers will allow one to reference a separate gadget module that will be loaded regardless of whether JavaScript is enabled. For example: <pre>* example [ResourceLoader|dependencies=mediawiki.util|peers=example-pagestyles] | example.js | example.css * example-pagestyles [hidden] | example-pagestyles.css </pre> This will register a gadget named "Example" in the preferences which, if enabled, will load example-pagestyles before the page renders. And, once JavaScript is available, the example module will also be loaded with its own dependencies, styles and scripts. <div class="mw-heading mw-heading3"><h3 id="Internet_Explorer_9_and_pre-ES5_browsers" data-mw-thread-id="h-Internet_Explorer_9_and_pre-ES5_browsers-MediaWiki_1.29">Internet Explorer 9 and pre-ES5 browsers</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=41" title="Edit section: Internet Explorer 9 and pre-ES5 browsers">edit</a>]</div> With this version, we have stopped JavaScript support for IE9 and other browsers that do not support <a href="https://en.wikipedia.org/wiki/ECMAScript#5th_Edition" class="extiw" title="en:ECMAScript">ES5</a>. See <a href="/wiki/Compatibility#Browsers" title="Compatibility">Compatibility</a> for details. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.28" data-mw-thread-id="h-MediaWiki_1.28"><a href="/wiki/Special:MyLanguage/MediaWiki_1.28" title="Special:MyLanguage/MediaWiki 1.28">MediaWiki 1.28</a><a href="/wiki/MediaWiki_1.28" title="MediaWiki 1.28"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=42" title="Edit section: MediaWiki 1.28">edit</a>]</div> This version is not supported. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.27" data-mw-thread-id="h-MediaWiki_1.27"><a href="/wiki/Special:MyLanguage/MediaWiki_1.27" title="Special:MyLanguage/MediaWiki 1.27">MediaWiki 1.27</a><a href="/wiki/MediaWiki_1.27" title="MediaWiki 1.27"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=43" title="Edit section: MediaWiki 1.27">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="Legacy_default:_mediawiki.util" data-mw-thread-id="h-Legacy_default:_mediawiki.util-MediaWiki_1.27">Legacy default: mediawiki.util</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=44" title="Edit section: Legacy default: mediawiki.util">edit</a>]</div> The <code><a href="/wiki/Special:MyLanguage/Manual:$wgPreloadJavaScriptMwUtil" title="Special:MyLanguage/Manual:$wgPreloadJavaScriptMwUtil">$wgPreloadJavaScriptMwUtil</a><a href="/wiki/Manual:$wgPreloadJavaScriptMwUtil" title="Manual:$wgPreloadJavaScriptMwUtil"> </a></code> option was removed. This option allowed third-party MediaWiki administrators to re-enable the unconditional preload of <code>mediawiki.util</code> by default for all users (for backwards compatibility). It was disabled by default since MediaWiki 1.26, and has been disabled on Wikimedia wikis since 2014. Extensions, skins, gadgets and scripts that use the <code>mediawiki.util</code> module must express a dependency on it. <div class="mw-heading mw-heading3"><h3 id="bits.wikimedia.org" data-mw-thread-id="h-bits.wikimedia.org-MediaWiki_1.27">bits.wikimedia.org</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=45" title="Edit section: bits.wikimedia.org">edit</a>]</div> The internal Wikimedia domain "bits.wikimedia.org" was deprecated sometime mid-2015. The following common paths should be migrated to avoid breakage once the domain is decommissioned (<a href="https://phabricator.wikimedia.org/T107430" class="extiw" title="phab:T107430">T107430</a>). <ul><li><code>bits.wikimedia.org/:domain/load.php</code> → <code>https://:domain/w/load.php</code> . Moved back to local domains, alongside <code>/w/index.php</code> and others.</li> <li><code>bits.wikimedia.org/static-current/*</code> → <code>https://:domain/static/current/</code>: Moved to local domain, sharing a hostname-agonistic Varnish cache. <ul><li><code>bits.wikimedia.org/skins/*</code> → <code>https://:domain/static/current/skins</code></li></ul></li> <li><code>bits.wikimedia.org/static-1.xx-wmf.X/*</code> → <code>https://:domain/w/*</code>: Specific versions can now be accessed through the regular script path. Wikimedia's multiversion entry point automatically serves the file from to the wikis' current MediaWiki version. (<a href="https://phabricator.wikimedia.org/T99096" class="extiw" title="phab:T99096">T99096</a>) <ul><li><code>bits.wikimedia.org/static-1.xx/skins/*</code> <code>→</code> <code>https://:domain/w/skins/*</code></li> <li><code>bits.wikimedia.org/static-1.xx/extensions/*</code> <code>→</code> <code>https://:domain/w/extensions/*</code></li> <li><code>bits.wikimedia.org/static-1.xx/resources/*</code> <code>→</code> <code>https://:domain/w/resources/*</code></li></ul></li></ul> <div class="mw-heading mw-heading3"><h3 id="Internet_Explorer_8" data-mw-thread-id="h-Internet_Explorer_8-MediaWiki_1.27">Internet Explorer 8</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=46" title="Edit section: Internet Explorer 8">edit</a>]</div> Following the deactivation of JavaScript in Internet Explorer 6 and 7 in MediaWiki 1.24, JavaScript has been deactivated in Internet Explorer 8. See <a href="/wiki/Compatibility#Browsers" title="Compatibility">Compatibility</a> for details. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.26" data-mw-thread-id="h-MediaWiki_1.26"><a href="/wiki/Special:MyLanguage/MediaWiki_1.26" title="Special:MyLanguage/MediaWiki 1.26">MediaWiki 1.26</a><a href="/wiki/MediaWiki_1.26" title="MediaWiki 1.26"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=47" title="Edit section: MediaWiki 1.26">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="Legacy_gadgets" data-mw-thread-id="h-Legacy_gadgets-MediaWiki_1.26">Legacy gadgets</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=48" title="Edit section: Legacy gadgets">edit</a>]</div> Gadgets are now required to use ResourceLoader. For many Gadgets, migrating to ResourceLoader will be as easy as adding <code>[ResourceLoader]</code> to its definition on MediaWiki:Gadgets-definition. If after adding that, the gadget is not working properly, consult the rest of this page to look for functionality that may have been removed since the gadget was last maintained. If you run into any issues or find features that don't work without a clear way of making it work, please reach out to MediaWiki developers and fellow gadget authors on the <a href="/wiki/Talk:ResourceLoader/Migration_guide_(users)" title="Talk:ResourceLoader/Migration guide (users)">talk page</a>, via <a href="/wiki/IRC" class="mw-redirect" title="IRC">IRC</a>, or on the <a href="/wiki/Mailing_lists" title="Mailing lists">wikitech-l</a> mailing list. <div class="mw-heading mw-heading4"><h4 id="Global_variables_are_not_global" data-mw-thread-id="h-Global_variables_are_not_global-Legacy_gadgets">Global variables are not global</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=49" title="Edit section: Global variables are not global">edit</a>]</div> When ResourceLoader loads a gadget script, it is not executed in global context. This means that local variables you define in the script are actually local, and not assumed to be also global. They are local to the function your code is wrapped in. It's best to modularize your code to avoid using globals, see <a href="/wiki/Manual:Coding_conventions/JavaScript#Globals" title="Manual:Coding conventions/JavaScript">"Globals" in MediaWiki's JavaScript coding conventions</a>. However, if you need to export a variable to the global scope, you can explicitly assign them as <code>window</code> properties. For example: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// This is a local variable var foo; // This is a local function function bar() { .. } // This is a global variable (accessible from other scripts, and from legacy event handlers, e.g. onclick="javascript:Quux();" window.Quux = function( width, height ) { ... }; </pre></div> Code within your gadget can access foo and bar. Code outside the gadget (or code evaluated as separate programs, such as legacy onclick handlers), can only access Quux.. As of August 2015, <a href="/wiki/ResourceLoader/Architecture#Debug_mode" title="ResourceLoader/Architecture">ResourceLoader debug mode</a> still executes scripts in global scope (<a href="https://phabricator.wikimedia.org/T64605" class="extiw" title="phab:T64605">phab:T64605</a>), so your code may seem to work fine in debug mode but be broken in regular mode. <div class="mw-heading mw-heading3"><h3 id="Font_mw-geshi" data-mw-thread-id="h-Font_mw-geshi-MediaWiki_1.26">Font mw-geshi</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=50" title="Edit section: Font mw-geshi">edit</a>]</div> The font-size of <code class="mw-highlight" style="white-space:nowrap">‎<syntaxhighlight></code> was often too small by default due to a font-family CSS bug. This was fixed in MediaWiki 1.26 (see (<a href="https://phabricator.wikimedia.org/T28204" class="extiw" title="phab:T28204">phab:T28204</a>). The <code>mw-geshi</code>, <code>source-css</code>, <code>source-javascript</code> and related classes no longer exist. Related code such as the following can be safely removed: <div class="errorbox"> <div class="mw-highlight mw-highlight-lang-css mw-content-ltr" dir="ltr"><pre>/* Fix <syntaxhighlight> text size. [[phab:T28204]] */ div.mw-geshi div, div.mw-geshi div pre, span.mw-geshi, pre.source-css, pre.source-javascript, pre.source-lua { font-family: monospace, Courier !important; } </pre></div> </div> <div class="mw-heading mw-heading3"><h3 id="Inline_scripts" data-mw-thread-id="h-Inline_scripts-MediaWiki_1.26">Inline scripts</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=51" title="Edit section: Inline scripts">edit</a>]</div> To inject JavaScript inline, use <code>ResourceLoader::makeInlineScript()</code> to wrap the JavaScript code in an anonymous function that can access MediaWiki-related objects properly, and <code>OutputPage::addScript()</code> to add the results to the page source for execution. For example: <div class="mw-highlight mw-highlight-lang-php mw-content-ltr" dir="ltr"><pre>$outputPage = RequestContext::getMain()->getOutput(); $js = 'alert("hello world");'; $wrappedJS = ResourceLoader::makeInlineScript($js); $outputPage->addScript($wrappedScript); </pre></div> <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.24" data-mw-thread-id="h-MediaWiki_1.24"><a href="/wiki/Special:MyLanguage/MediaWiki_1.24" title="Special:MyLanguage/MediaWiki 1.24">MediaWiki 1.24</a><a href="/wiki/MediaWiki_1.24" title="MediaWiki 1.24"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=52" title="Edit section: MediaWiki 1.24">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="Legacy_removals_2" data-mw-thread-id="h-Legacy_removals_2-MediaWiki_1.24">Legacy removals</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=53" title="Edit section: Legacy removals">edit</a>]</div> The <code>jquery.delayedBind</code> JavaScript module, deprecated in MediaWiki 1.23, has been removed. See <a href="https://phabricator.wikimedia.org/rMW8f2ebcbf6769" class="extiw" title="phab:rMW8f2ebcbf6769">phab:rMW8f2ebcbf6769</a>. <div class="mw-heading mw-heading3"><h3 id="Internet_Explorer" data-mw-thread-id="h-Internet_Explorer-MediaWiki_1.24">Internet Explorer</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=54" title="Edit section: Internet Explorer">edit</a>]</div> Browser support for Internet Explorer 6 and 7 changed from Grade A to Grade C. This means JavaScript is no longer executed in these browser versions. See <a href="/wiki/Compatibility#Browsers" title="Compatibility">Compatibility</a> for details. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.20" data-mw-thread-id="h-MediaWiki_1.20"><a href="/wiki/Special:MyLanguage/MediaWiki_1.20" title="Special:MyLanguage/MediaWiki 1.20">MediaWiki 1.20</a><a href="/wiki/MediaWiki_1.20" title="MediaWiki 1.20"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=55" title="Edit section: MediaWiki 1.20">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="mw.util.jsMessage" data-mw-thread-id="h-mw.util.jsMessage-MediaWiki_1.20">mw.util.jsMessage</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=56" title="Edit section: mw.util.jsMessage">edit</a>]</div> This method has been deprecated in favour of <a href="/wiki/ResourceLoader/Core_modules#mw.notify" title="ResourceLoader/Core modules">mw.notify</a>. The jsMessage message was designed to be a drop-in replacement fully compatible with the legacy wikibits <code>jsMsg</code> function (deprecated since 1.17, removed in 1.29). The 2012 notification system on the other hand was designed with developer usability and security in mind. For most cases, the new method is just as easy to use as the old one, and requires only a the same single parameter that represents the message. For example, with plain text:<div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// Deprecated (dependencies: mediawiki.util) var msgText = 'Hello world'; mw.util.jsMessage(msgText); // New, as of 2012 (dependencies: mediawiki.notify) var msgText = 'Hello world'; mw.notify(msgText); </pre></div>And another example, with a DOM element, or a jQuery object:<div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// Deprecated (dependencies: mediawiki.util) var $myWidget = ExampleWidget.create( { having: '2-buttons', toggle: '#sidebar' }); mw.util.jsMessage($myWidget); // New, as of 2012 (dependencies: mediawiki.notify) var $myWidget = ExampleWidget.create( { having: '2-buttons', toggle: '#sidebar' }); mw.notify($myWidget); </pre></div>If you're currently using raw HTML with <code>mw.util.jsMessage()</code>, the simplest way to migrate is to do what jsMessage used to do internally for you, which is to parse the HTML and place the node(s) in a jQuery object, as follows:<div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// Deprecated (dependencies: mediawiki.util) var msgHtml = '<form><button>Click me</button></form>'; mw.util.jsMessage(msgHtml); // New, as of 2012 (dependencies: mediawiki.notify) var msgHtml = '<form><button>Click me</button></form>'; var $msg = $($.parseHTML(msgHtml)); mw.notify($msg); </pre></div> <div class="mw-heading mw-heading3"><h3 id="New_diff_styles" data-mw-thread-id="h-New_diff_styles-MediaWiki_1.20">New diff styles</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=57" title="Edit section: New diff styles">edit</a>]</div> This version introduces a new diff view, greatly improved in clarity especially for whitespace and other small changes and colour-blind users. If your wiki has custom CSS for the diffs, they may be in conflict with the new style (as happened on <a class="external text" href="https://pt.wikipedia.org/w/index.php?title=MediaWiki%3ACommon.css&diff=29858952&oldid=28922245&uselang=en">ptwiki</a> and <a class="external text" href="https://sr.wikipedia.org/w/index.php?diff=5578051&oldid=5533214&uselang=en">srwiki</a>). You are recommended to remove the old code (or if still wanted by some users, update it to work with the new layout and create a gadget for it so that users can opt-in to it still). <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.19" data-mw-thread-id="h-MediaWiki_1.19"><a href="/wiki/Special:MyLanguage/MediaWiki_1.19" title="Special:MyLanguage/MediaWiki 1.19">MediaWiki 1.19</a><a href="/wiki/MediaWiki_1.19" title="MediaWiki 1.19"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=58" title="Edit section: MediaWiki 1.19">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="wikitable_style_updates" data-mw-thread-id="h-wikitable_style_updates-MediaWiki_1.19">wikitable style updates</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=59" title="Edit section: wikitable style updates">edit</a>]</div> As of <a href="/wiki/MediaWiki_1.19" title="MediaWiki 1.19">MediaWiki 1.19</a> a few bugs have been fixed with the <code>wikitable</code> class (see <a href="https://phabricator.wikimedia.org/T32485" class="extiw" title="phab:T32485">phab:T32485</a> and <a href="https://phabricator.wikimedia.org/T35434" class="extiw" title="phab:T35434">phab:T35434</a> for more info). If your wiki maintains a legacy synonym of this class (e.g. "<code>prettytable</code>") you need to update its CSS to match the current style in core. The current style as of 1.19 can be found <a rel="nofollow" class="external text" href="https://github.com/wikimedia/mediawiki/blob/1.19.24/skins/common/shared.css">here</a>. Copy those rules to your wiki and replace "wikitable" with the synonym (<a class="external text" href="https://nl.wikipedia.org/w/index.php?title=MediaWiki:Common.css&diff=29814645&oldid=29702942">example for nl.wikipedia</a>). If your wiki doesn't keep something like this, then no update is necessary and everything should take care of itself. <div class="mw-heading mw-heading3"><h3 id="File_page_checkered_background" data-mw-thread-id="h-File_page_checkered_background-MediaWiki_1.19">File page checkered background</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=60" title="Edit section: File page checkered background">edit</a>]</div> The checkered background often applied to transparent file namespace pages is now part of the software. Local rules like the following should be removed (because they are redundant, and actually cause an additional unnecessary HTTP request for the image) <div class="mw-highlight mw-highlight-lang-css mw-content-ltr" dir="ltr"><pre>/* Put a checker background at the image description page. Only visible if the image has transparent background. */ #file img { background: url("//upload.wikimedia.org/wikipedia/commons/5/5d/Checker-16x16.png") repeat; } </pre></div> <div class="mw-heading mw-heading3"><h3 id="Trackbacks" data-mw-thread-id="h-Trackbacks-MediaWiki_1.19">Trackbacks</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=61" title="Edit section: Trackbacks">edit</a>]</div> Trackbacks were removed from MediaWiki core, so any styling targeting <code>#mw_trackbacks</code> can be removed. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.18" data-mw-thread-id="h-MediaWiki_1.18"><a href="/wiki/Special:MyLanguage/MediaWiki_1.18" title="Special:MyLanguage/MediaWiki 1.18">MediaWiki 1.18</a><a href="/wiki/MediaWiki_1.18" title="MediaWiki 1.18"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=62" title="Edit section: MediaWiki 1.18">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="Protocol-relative_urls" data-mw-thread-id="h-Protocol-relative_urls-MediaWiki_1.18">Protocol-relative urls</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=63" title="Edit section: Protocol-relative urls">edit</a>]</div> <dl><dd>This change only applies to Wikimedia Foundation wikis.</dd></dl> As of <a href="/wiki/MediaWiki_1.18" title="MediaWiki 1.18">MediaWiki 1.18</a> there is native support for protocol-relative wiki installations. This means that a wiki could be accessible from both <a rel="nofollow" class="external free" href="http://example.org/">http://example.org/</a> and <a rel="nofollow" class="external free" href="https://example.org./">https://example.org./</a> To make it possible to a share a common cache for as much as possible, we make use of a technique called protocol-relative urls. Although browsers have supports this for ages, script writers generally aren't very familiar with it until fairly recently. Briefly explained, this means that <code class="mw-highlight mw-highlight-lang-html mw-content-ltr" dir="ltr"><img src="//meta.wikimedia.org" /></code> when on "https://example.org" will be automatically expanded by the browser to <a rel="nofollow" class="external free" href="https://meta.wikimedia.org./">https://meta.wikimedia.org./</a> This is much like (for example) <code class="mw-highlight mw-highlight-lang-html mw-content-ltr" dir="ltr"><img src="foobar.jpg" /></code> or <code class="mw-highlight mw-highlight-lang-html mw-content-ltr" dir="ltr"><img src="/w/foobar.jpg" /></code>, which are are automatically expanded to "http://mediawiki.org/w/foobar.jpg". Depending on how the scripts were written this may require some changes to be made to your scripts. If you use the following method to detect whether the script is executed on a certain wiki, this change will break your script: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>if ( wgServer === 'http://en.wikipedia.org' ) { // Doesn't work anymore! } </pre></div> because wgServer is now "<code>//en.wikipedia.org</code>". For a few years there has been another config variable, called "<code>wgDBname</code>". You should use that instead to differentiate wikis, like: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>if ( mw.config.get( 'wgDBname' ) === 'enwiki' ) { // English Wikipedia! } </pre></div> Alternatively, you can use <code>wgServerName</code> which is without the protocol or port: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>if ( mw.config.get( 'wgServerName' ) === 'en.wikipedia.org' ) { // English Wikipedia! } </pre></div> <div class="mw-heading mw-heading3"><h3 id=""Enabled_by_default"_(Gadgets_extension)" data-mw-thread-id="h-"Enabled_by_default"_(Gadgets_extension)-MediaWiki_1.18">"Enabled by default" (Gadgets extension)</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=64" title="Edit section: "Enabled by default" (Gadgets extension)">edit</a>]</div> As of the version of the Gadgets extension at the MW 1.18 branchpoint, there is a new feature that allows a gadget to be opt-out instead of opt-in based. By setting "<code>[default]</code>" (or adding "<code>|default</code>" to an existing section) the gadget will be enabled by default for everybody, unless a user has specifically opted out by unticking the checkbox on <a href="/wiki/Special:Preferences#mw-prefsection-gadgets" title="Special:Preferences">Special:Preferences#mw-prefsection-gadgets</a>. Note that this also loads it for all anonymous users. Gadgets that are only for logged-in users should be additionally restricted by, for example, requiring certain user rights. See also <a href="/wiki/Extension:Gadgets#Options" title="Extension:Gadgets">Extension:Gadgets#Options</a>. <div class="mw-heading mw-heading3"><h3 id="mw.util.wikiScript" data-mw-thread-id="h-mw.util.wikiScript-MediaWiki_1.18">mw.util.wikiScript</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=65" title="Edit section: mw.util.wikiScript">edit</a>]</div> The actual paths have not changed, but getting the path to the API and index.php has become a lot easier. This also makes the code more portable as it has no hardcoded wiki-specific paths. This is how it used to go in many gadgets. <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>var foo = 'bar'; var apiUrl = '//www.mediawiki.org/w/api.php?foo=' + encodeURIComponent( foo ) + '&baz=quux'; $.ajax( { url: apiUrl, ... } ); </pre></div> Instead use something like one of the following: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// Behold, mw.util.wikiScript! var foo = 'bar'; var apiUrl = mw.util.wikiScript( 'api' ) + '?foo=' + encodeURIComponent( foo ) + '&baz=quux'; $.ajax( { url: apiUrl, ... } ); </pre></div> You may also want to use <code>$.param</code> to automatically escape and create things properly in the query string: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// $.param is also awesome. No need for encodeURIComponent that way :) var foo = 'bar'; var apiUrl = mw.util.wikiScript( 'api' ) + '?' + $.param( { foo: foo, baz: 'quux' } ); $.ajax( { url: apiUrl, ... } ); </pre></div> You can even use the <code>data</code> option of <a rel="nofollow" class="external text" href="http://api.jquery.com/jQuery.ajax/"><code>$.ajax</code></a>, that abstracts away the need to deal with the query string entirely: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// No longer needed to inject the '?' or '&' in the url $.ajax( { url: mw.util.wikiScript( 'api' ), data: { foo: 'bar', baz: 'quux' }, ... } ); </pre></div> <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.17" data-mw-thread-id="h-MediaWiki_1.17"><a href="/wiki/Special:MyLanguage/MediaWiki_1.17" title="Special:MyLanguage/MediaWiki 1.17">MediaWiki 1.17</a><a href="/wiki/MediaWiki_1.17" title="MediaWiki 1.17"> </a></h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=66" title="Edit section: MediaWiki 1.17">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="jQuery" data-mw-thread-id="h-jQuery-MediaWiki_1.17">jQuery</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=67" title="Edit section: jQuery">edit</a>]</div> <dl><dd>See also <a href="/wiki/JQuery" title="JQuery">jQuery</a></dd></dl> As of <a href="/wiki/MediaWiki_1.17" title="MediaWiki 1.17">1.17</a> the jQuery library is loaded by default on all MediaWiki pages. Each MediaWiki release will keep it up to date with the latest version of jQuery. If you used to load jQuery from within your script, (e.g. from ajax.googleapis.com), make sure you remove that. If you load jQuery more than once on a page, it overwrites the earlier version. Other scripts break because they may not work with an older version of jQuery. Also, by overwriting the jQuery object, any plugins that were bound to that object are also lost. Global identifier "<code>$j</code>" has been deprecated. Use <code>jQuery</code> or <code>$</code> instead. <div class="mw-heading mw-heading3"><h3 id="Tabs_(vector)" data-mw-thread-id="h-Tabs_(vector)-MediaWiki_1.17">Tabs (vector)</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=68" title="Edit section: Tabs (vector)">edit</a>]</div> In 1.17 the HTML construction for the navigation tabs has changed from <code class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><li><a><span /></a></li></code> to <code class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><li><span><a /></span></li></code>. The most common situation in which this causes problems is where scripts assume the presence of the span element when, for example, customizing the tab for "Main Page". Before 1.17 this usually meant that wikis had a different implementation for Monobook and one for Vector (or only one for each and the other was distorted). Please use MediaWiki:Mainpage-nstab or refer to <a href="/wiki/Snippets/Main_Page_tab" title="Snippets/Main Page tab">Snippets/Main Page tab</a> for a script that will work in both Vector and Monobook for 1.17. <div class="mw-heading mw-heading3"><h3 id="Adding_portlet_links" data-mw-thread-id="h-Adding_portlet_links-MediaWiki_1.17">Adding portlet links</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=69" title="Edit section: Adding portlet links">edit</a>]</div> The legacy function <code>addPortletLink</code> has been rewritten as <code><a href="/wiki/RL/DM#addPortletLink" class="mw-redirect" title="RL/DM">mw.util.addPortletLink</a></code>. The syntax and argument order is fully backwards compatible. The differences <ul><li>Support for all core skins now</li> <li>Support for simple id-selector as 'nextNode' (see <a href="/wiki/RL/DM#addPortletLink" class="mw-redirect" title="RL/DM">documentation</a> for details).</li></ul> Some wikis may have re-defined / overwritten the <code>addPortlinkLink</code> function to support a few extra skins. This is no longer needed. The function definition should be removed and calls adjusted to <code>mw.util.addPortletLink</code>. The legacy version of <code>addPortlinkLink</code> has been preserved as-is in case some edge cases would behave differently (for that reason the <code>addPortlinkLink</code> does not redirect to mw.util.addPortlinkLink) <div class="mw-heading mw-heading3"><h3 id="Toolbar" data-mw-thread-id="h-Toolbar-MediaWiki_1.17">Toolbar</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=70" title="Edit section: Toolbar">edit</a>]</div> The legacy array <code>mwCustomEditButtons</code> has been refactored into the <code>mw.toolbar</code> library. The global array still exists in wikibits to avoid fatal errors but is no longer used due to race conditions. Code may run too late when the toolbar already exists. Using <code>mw.toolbar.addButton</code> will work always, even if the toolbar has already been created. See <a href="https://doc.wikimedia.org/mediawiki-core/master/js/#!/api/mw.toolbar" class="extiw" title="wmdoc:mediawiki-core/master/js/">mw.toolbar Documentation</a>. Note that mw.toolbar, just like the old mwCustomEditButtons array, are associated with the classic toolbar. The current default wikitext editor is WikiEditor, which has its own API. See <a href="/wiki/Extension:WikiEditor/Toolbar_customization" title="Extension:WikiEditor/Toolbar customization">Extension:WikiEditor/Toolbar customization</a> for more information. <div class="mw-heading mw-heading3"><h3 id="Sajax" data-mw-thread-id="h-Sajax-MediaWiki_1.17">Sajax</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=71" title="Edit section: Sajax">edit</a>]</div> The legacy functions such as <code>sajax_init_object</code> have been deprecated. Instead, <code>mw.Api</code> from the <code>mediawiki.api</code> module, or <code>jQuery.ajax</code>. <ul><li><a href="https://doc.wikimedia.org/mediawiki-core/master/js/mw.Api.html" class="extiw" title="wmdoc:mediawiki-core/master/js/mw.Api.html">mediawiki.api documentation</a></li> <li><a rel="nofollow" class="external text" href="http://api.jquery.com/jQuery.ajax/">jQuery.ajax documentation</a></li></ul> Migration guide: <table class="wikitable plainlinks"> <tbody><tr> <th>Identifier </th> <th>Type </th> <th>Replaced by </th></tr> <tr> <td>sajax_debug_mode </td> <td>string </td> <td rowspan="5">» <a rel="nofollow" class="external text" href="http://api.jquery.com/jQuery.ajax/">jQuery.ajax</a> Use <code class="plainlinks"><a rel="nofollow" class="external text" href="http://api.jquery.com/category/ajax/">AJAX</a></code> functions to access pages and the API directly. <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>$( '#mybox' ).load( '/wiki/Template:ResourceLoader_navigation #bodyContent' ); $.get( mw.config.get( 'wgScript' ), { title: 'ResourceLoader', action: 'raw' }, function( data ) { /* Call was successful do something with "data" */ } ); $.getJSON( mw.util.wikiScript( 'api' ), { format: 'json', action: 'query', titles: 'Main Page', prop: 'info' }, function( obj ) { /* API call was successful do something with obj */ } ); </pre></div> For more information see documentation for <a rel="nofollow" class="external text" href="http://api.jquery.com/load/">.load()</a>, <a rel="nofollow" class="external text" href="http://api.jquery.com/jQuery.get/">.get()</a>, <a rel="nofollow" class="external text" href="http://api.jquery.com/jQuery.getJSON/">.getJSON()</a> and the <a rel="nofollow" class="external text" href="http://api.jquery.com/category/ajax/">other jQuery Ajax functions</a>. See also <a href="https://en.wikipedia.org/wiki/Wikipedia:WikiProject_User_scripts/Guide/Ajax#jQuery_examples" class="extiw" title="w:Wikipedia:WikiProject User scripts/Guide/Ajax">this guide</a> from <a href="https://en.wikipedia.org/wiki/Wikipedia:WikiProject_User_scripts" class="extiw" title="w:Wikipedia:WikiProject User scripts">WikiProject User scripts</a>, for an example of how to edit a wikipage using AJAX. </td></tr> <tr> <td>sajax_request_type </td> <td>string </td></tr> <tr> <td>sajax_debug </td> <td>function </td></tr> <tr> <td>sajax_init_object </td> <td>function </td></tr> <tr> <td>wfSupportsAjax </td> <td>function </td></tr> <tr> <td>sajax_do_call </td> <td>function </td> <td> <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>$.get( mw.util.wikiScript(), { action: 'ajax', rs: 'SomeExtensionFunction', rsargs: [arg1, arg2, arg3] // becomes &rsargs[]=arg1&rsargs[]=arg2... } ); </pre></div> Note: These calls using action=ajax should be rewritten to use an API module </td></tr></tbody></table> <div class="mw-heading mw-heading3"><h3 id="Client_testing" data-mw-thread-id="h-Client_testing-MediaWiki_1.17">Client testing</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=72" title="Edit section: Client testing">edit</a>]</div> Checking which browser, platform, layout engine etc. has should now be done with <a href="/wiki/RL/DM#jquery.client" class="mw-redirect" title="RL/DM">jQuery.client</a>. <ul><li><code>is_safari</code>, <code>is_chrome</code> etc. are deprecated</li> <li>No need to <code>navigator.userAgent.indexOf("MSIE 6")==-1</code> etc.</li></ul> <div class="mw-heading mw-heading3"><h3 id="Sysop_script" data-mw-thread-id="h-Sysop_script-MediaWiki_1.17">Sysop script</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=73" title="Edit section: Sysop script">edit</a>]</div> New in <a href="/wiki/MediaWiki_1.17" title="MediaWiki 1.17">MediaWiki 1.17</a> is a user groups module that can automatically load scripts and styles from the MediaWiki namespace for a particular user group. For example, if the wiki has MediaWiki:Group-sysop.js, this script is automatically loaded for all users in that group. This should obsolete customisations wikis may have with regards to loading MediaWiki:Sysop.js with importScript inside Common.js. <div class="mw-heading mw-heading3"><h3 id="mw.loader" data-mw-thread-id="h-mw.loader-MediaWiki_1.17">mw.loader</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=74" title="Edit section: mw.loader">edit</a>]</div> If you need certain scripts like <a rel="nofollow" class="external text" href="http://jqueryui.com/">jQuery UI</a>'s dialog or datepicker, instead of doing something like: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>importStylesheetURI( mw.config.get( 'wgExtensionAssetsPath' ) + '/Example/css/jquery-ui-1.7.2.css' ); $.getScript( mw.config.get( 'wgExtensionAssetsPath' ) + '/Example/js/jui.combined.min.js', function () { MyTool.init(); } ); </pre></div> Instead use this: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>mw.loader.using( ['jquery.ui.dialog', 'jquery.ui.datepicker'], MyTool.init ); </pre></div> Or if you need to delay initialization until document.ready: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>mw.loader.using( ['jquery.ui.dialog', 'jquery.ui.datepicker'], function () { $( document ).ready( MyTool.init ); } ); </pre></div> <div class="mw-heading mw-heading5"><h5 id="Dependencies" data-mw-thread-id="h-Dependencies-mw.loader">Dependencies</h5>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=75" title="Edit section: Dependencies">edit</a>]</div> When a script depends on another module, such as <code>oojs</code> or <code>mediawiki.util</code>, you will need to declare this as a "dependency". This is because modules are loaded on-demand and asynchronously (in consecutive order: all at the same time), so a script needs to make sure a module has been loaded before it can use its methods. On-site modules, like gadgets, have a registry to declare these dependencies. For user scripts, one has to wrap code with <code><a href="/wiki/Special:MyLanguage/ResourceLoader/Core_modules#mw.loader" title="Special:MyLanguage/ResourceLoader/Core modules">mw.loader.using()</a><a href="/wiki/ResourceLoader/Core_modules#mw.loader" title="ResourceLoader/Core modules"> </a></code>. While this has been required since 2011, many scripts have continued to work without declaring their dependencies. Scripts may have worked before by accident as long as at least one user script (that used the same methods) did declare their dependencies and happened to load earlier. With MediaWiki 1.19, page view performance has been optimised to use fewer modules by default. This makes it increasingly more important to declare the dependencies. Otherwise, your script may fail because any of the 1000+ modules you might refer to in your code would not be loaded yet. Loading everything all the time would be much too slow. The only two base modules that are always present are <code>mediawiki</code> and <code>jquery</code>. <div class="mw-heading mw-heading5"><h5 id="In_practice" data-mw-thread-id="h-In_practice-mw.loader">In practice</h5>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=76" title="Edit section: In practice">edit</a>]</div> Use <code>mw.loader.using()</code> to declare any modules that you need before executing the contents of "function". You can pass multiple modules as an array of strings. <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>mw.loader.using( ['mediawiki.util', 'oojs', 'jquery.cookie'], function () { /* some other script that uses $.cookie */ /* some other script that uses mw.util and OO.EventEmitter() */ } ); </pre></div> <div class="mw-heading mw-heading3"><h3 id="Global_wg_variables" data-mw-thread-id="h-Global_wg_variables-MediaWiki_1.17">Global wg variables</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=77" title="Edit section: Global wg variables">edit</a>]</div> As of MediaWiki 1.17, the global config variables are deprecated. Rationale to clear the global namespace, working towards a reality where most of the core libraries will be object oriented as part of the <code>mw</code> object. Configuration is managed through an instance of <code><a href="/wiki/ResourceLoader/Default_modules#mw.Map" class="mw-redirect" title="ResourceLoader/Default modules">mw.Map</a></code> in <code>mw.config</code>. It is also supporting the behaviour of more script executing in their own local/private scope as opposed to the global scope. Legacy globals will be kept for backwards compatibility, but people should start migrating so that they may removed in a future version of MediaWiki (<a href="https://phabricator.wikimedia.org/T35837" class="extiw" title="phabricator:T35837">task T35837</a>). <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// One variable if ( mw.config.get( 'wgCanonicalSpecialPageName' ) === 'Search' ) { // Example for Special:Search } if ( mw.config.get( 'wgGlobalGroups', [] ).indexOf( 'global-rollbacker' ) !== -1 ) { // Example for users in the global group "global-rollbacker". } // Multiple variables var conf = mw.config.get( [ 'wgScript', 'wgAction' ] ); if ( conf.wgAction === 'edit' ) { console.log( 'Example when editing a page', config.wgScript ); } </pre></div> More info: <a href="/wiki/ResourceLoader/Default_modules#mw.config" class="mw-redirect" title="ResourceLoader/Default modules">ResourceLoader/Default modules#mw.config</a> <div class="mw-heading mw-heading3"><h3 id="Ready,_onload,_hook" data-mw-thread-id="h-Ready,_onload,_hook-MediaWiki_1.17">Ready, onload, hook</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=78" title="Edit section: Ready, onload, hook">edit</a>]</div> Check <a href="#addOnloadHook">JavaScript deprecation overview</a> for "<code>addOnloadHook</code>". Use <code>$( function );</code> instead, or <code>$( fn );</code> for short. <div class="mw-heading mw-heading3"><h3 id="New_CSS_declarations_in_core" data-mw-thread-id="h-New_CSS_declarations_in_core-MediaWiki_1.17">New CSS declarations in core</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=79" title="Edit section: New CSS declarations in core">edit</a>]</div> <div class="mw-heading mw-heading4"><h4 id="Headings_overflow_hidden" data-mw-thread-id="h-Headings_overflow_hidden-New_CSS_declarations_in_core">Headings overflow hidden</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=80" title="Edit section: Headings overflow hidden">edit</a>]</div> <code>overflow:hidden</code> for any of h1, h2, h3, h4, h5 and/or h6 can be safely removed from stylesheets as this is now part of the core. <div class="mw-heading mw-heading4"><h4 id="Italic_redirects" data-mw-thread-id="h-Italic_redirects-New_CSS_declarations_in_core">Italic redirects</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=81" title="Edit section: Italic redirects">edit</a>]</div> Links to redirects now appear italicized by default on <a href="/wiki/Special:AllPages" title="Special:AllPages">Special:AllPages</a>, <a href="/wiki/Special:PrefixIndex" title="Special:PrefixIndex">Special:PrefixIndex</a>, <a href="/wiki/Special:Watchlist/edit" title="Special:Watchlist/edit">Special:Watchlist/edit</a> and in category listings. Overrides like the following are redundant and can be safely removed. <pre>.allpagesredirect, .redirect-in-category, .watchlistredir { font-style: italic; } </pre> <div class="mw-heading mw-heading4"><h4 id="wpSummary" data-mw-thread-id="h-wpSummary-New_CSS_declarations_in_core">wpSummary</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=82" title="Edit section: wpSummary">edit</a>]</div> Per <a href="https://phabricator.wikimedia.org/T22276" class="extiw" title="phab:T22276">phab:T22276</a>, <code>input#wpSummary</code>'s <code>width</code> is now set in Vector as well (instead of just Monobook). <div class="mw-heading mw-heading3"><h3 id="UsabilityInitiative_no_more" data-mw-thread-id="h-UsabilityInitiative_no_more-MediaWiki_1.17">UsabilityInitiative no more</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=83" title="Edit section: UsabilityInitiative no more">edit</a>]</div> As of 1.17 the functionality developed by the UsabilityInitiative has been extracted to stand-alone extensions. Buttons like "#pt-optin-try" no longer exist. You can enable/disable these functions like other extensions via <a href="/wiki/Special:Preferences" title="Special:Preferences">Special:Preferences</a>. Scripts and styles doing things like "HideUsabilityOptIn": <div class="mw-highlight mw-highlight-lang-css mw-content-ltr" dir="ltr"><pre>#pt-optin-try { display: none !important; } </pre></div> should therefore be deleted entirely as the button no longer exists. <div class="mw-heading mw-heading3"><h3 id="Preformatted_JS/CSS_pages" data-mw-thread-id="h-Preformatted_JS/CSS_pages-MediaWiki_1.17">Preformatted JS/CSS pages</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=84" title="Edit section: Preformatted JS/CSS pages">edit</a>]</div> It's no longer useful to wrap these pages in <code> /* <pre> */ </code> or <code> // <syntaxhighlight lang="javascript"></code> etc. In newer versions of MediaWiki, these pages are rendered as code automatically (including syntax highlighting when available). See also <a href="https://phabricator.wikimedia.org/T6801" class="extiw" title="phabricator:T6801">task T6801</a>. <div class="mw-heading mw-heading3"><h3 id="Table_sorter" data-mw-thread-id="h-Table_sorter-MediaWiki_1.17">Table sorter</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=85" title="Edit section: Table sorter">edit</a>]</div> The old table sorter in <code>wikibits.js</code> was removed in favour of <code>jquery.tablesorter</code>. Variables such as <code>ts_alternate_row_colors</code>, and functions like <code>ts_parseFloat</code> and <code>ts_dateToSortKey</code> no longer exist. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="MediaWiki_1.16_and_before" data-mw-thread-id="h-MediaWiki_1.16_and_before"><a href="/wiki/Special:MyLanguage/MediaWiki_1.16" title="Special:MyLanguage/MediaWiki 1.16">MediaWiki 1.16</a><a href="/wiki/MediaWiki_1.16" title="MediaWiki 1.16"> </a> and before</h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=86" title="Edit section: MediaWiki 1.16 and before">edit</a>]</div> <div class="mw-heading mw-heading3"><h3 id="importScript" data-mw-thread-id="h-importScript-MediaWiki_1.16_and_before">importScript</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=87" title="Edit section: importScript">edit</a>]</div> As of 2008, the <code>importScript</code> function commonly defined by communities locally became a built-in part of MediaWiki ("wikibits.js"). Wikis that previously defined this function themselves, are able to remove that. The new built-in function is automatically used. The same also applies to <code>importStylesheet</code>, <code>importStylesheetURI</code> and <code>importScriptURI</code>. Note that <code>importStylesheetURI</code> and <code>importScriptURI</code> were subsequently deprecated in 2011 with MediaWiki 1.17, and disabled on mobile sites like <a class="external free" href="https://en.m.wikipedia.org/">https://en.m.wikipedia.org/</a>. Use <a href="/wiki/ResourceLoader/Core_modules#mw.loader" title="ResourceLoader/Core modules">mw.loader.load</a> instead. <div class="mw-heading mw-heading3"><h3 id="addPortletLink" data-mw-thread-id="h-addPortletLink-MediaWiki_1.16_and_before">addPortletLink</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=88" title="Edit section: addPortletLink">edit</a>]</div> As of 2008, the function <code>addPortletLink</code> is part of MediaWiki. Many wikis and gadgets have created functions like <code>addLink</code>, <code>addLiLink</code>, <code>addlilink</code> etc. these should be removed as they most likely don't support different skins (ie. only Monobook, not Vector or older skins). Be sure to check the syntax as there is no way of knowing the creator of those local functions used the same parameter order. <dl><dd>Note: The global function was <a href="/wiki/RL/JD#wikibits.js" class="mw-redirect" title="RL/JD">deprecated</a> in 2012 and moved to the mediawiki.util module as <code><a href="/wiki/RL/DM#addPortletLink" class="mw-redirect" title="RL/DM">mw.util.addPortletLink</a>()</code></dd></dl> <div class="mw-heading mw-heading3"><h3 id="appendCSS" data-mw-thread-id="h-appendCSS-MediaWiki_1.16_and_before">appendCSS</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=89" title="Edit section: appendCSS">edit</a>]</div> As of 2008, the function <code>appendCSS</code> is part of MediaWiki. Wikis that have defined this function themselves may remove that. It will automatically use the new function. <dl><dd>Note: The global function was <a href="/wiki/RL/JD#importScript" class="mw-redirect" title="RL/JD">deprecated</a> in 2012 and moved to the mediawiki.util module as <code><a href="/wiki/RL/DM#addCSS" class="mw-redirect" title="RL/DM">mw.util.addCSS</a>()</code></dd></dl> <div class="mw-heading mw-heading3"><h3 id="HTML_bugs_in_core" data-mw-thread-id="h-HTML_bugs_in_core-MediaWiki_1.16_and_before">HTML bugs in core</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=90" title="Edit section: HTML bugs in core">edit</a>]</div> <div class="mw-heading mw-heading4"><h4 id="html_lang" data-mw-thread-id="h-html_lang-HTML_bugs_in_core">html lang</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=91" title="Edit section: html lang">edit</a>]</div> This bugfix is obsolete as MediaWiki does this correctly by default. (<a class="external text" href="https://zh.wikibooks.org/w/index.php?title=MediaWiki%3ACommon.js&type=revision&diff=77150&oldid=77149">example</a>) <div class="errorbox"> <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>var htmlE = document.documentElement; htmlE.setAttribute('lang', mw.config.get('wgUserLanguage')); </pre></div> </div> <div class="mw-heading mw-heading3"><h3 id="CSS_declarations_new_in_core" data-mw-thread-id="h-CSS_declarations_new_in_core-MediaWiki_1.16_and_before">CSS declarations new in core</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=92" title="Edit section: CSS declarations new in core">edit</a>]</div> <div class="mw-heading mw-heading4"><h4 id="wikitable" data-mw-thread-id="h-wikitable-CSS_declarations_new_in_core">wikitable</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=93" title="Edit section: wikitable">edit</a>]</div> The <code>.wikitable</code> CSS class is part of MediaWiki. Wikis that previously defined this class in their <code>Common.css</code> should remove it. Do check if the wiki has any customisations that should be retained (e.g. different background-color, or font-size). <div class="mw-heading mw-heading4"><h4 id="plainlinks" data-mw-thread-id="h-plainlinks-CSS_declarations_new_in_core">plainlinks</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=94" title="Edit section: plainlinks">edit</a>]</div> The <code>.plainlinks</code> CSS class is part of MediaWiki. Wikis that previously defined this class in their <code>Common.css</code> should remove it. Alternative names for this feature, that were in popular use on Wikimedia Foundation wikis, include: <code>.plainlinksneverexpand</code> and <code>.nounderlines</code>. Replace any usage on wiki pages "plainlinks", and afterward these alternate styles may also be removed. For example, use search and query for <code>insource:plainlinksneverexpand</code>. <div class="mw-heading mw-heading4"><h4 id="mw-plusminus" data-mw-thread-id="h-mw-plusminus-CSS_declarations_new_in_core">mw-plusminus</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=95" title="Edit section: mw-plusminus">edit</a>]</div> The CSS classes <code>.mw-plusminus-pos</code>, <code>.mw-plusminus-null</code>, and <code>.mw-plusminus-neg</code> are now implemented by MediaWiki. <div class="mw-heading mw-heading4"><h4 id="External_URLs" data-mw-thread-id="h-External_URLs-CSS_declarations_new_in_core">External URLs</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=96" title="Edit section: External URLs">edit</a>]</div> Icons for protocols like <a class="external text" href="https://www.mediawiki.org/wiki/RL">HTTP</a>, <a rel="nofollow" class="external text" href="irc://irc.example.org/">IRC</a>, etc. and file types like <a class="external text" href="https://www.mediawiki.org/wiki/.pdf">PDF</a> are now supported by MediaWiki. <div class="mw-heading mw-heading3"><h3 id="Tooltip_and_accesskeys" data-mw-thread-id="h-Tooltip_and_accesskeys-MediaWiki_1.16_and_before">Tooltip and accesskeys</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=97" title="Edit section: Tooltip and accesskeys">edit</a>]</div> Scripts like <code>ta['pt-userpage'] = new Array('.','My user page');</code> are ignored. It was deprecated in 2009. The function akeytt() no longer exists. Tooltips and accesskeys are now supported from core. The most common values that wikis used with ta[] are the same that have now been integrated into the core (ie. "." for "my user page"). They can still be modified, if really needed, by sysops in MediaWiki-messages (no need for JavaScript workarounds anymore). As of MediaWiki 1.19 the global dummy placeholder <code>ta = new Object();</code> was removed from <code>wikibits.js</code>. Code trying to add members to it will likely emit an exception. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="Best_practices" data-mw-thread-id="h-Best_practices">Best practices</h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=98" title="Edit section: Best practices">edit</a>]</div> The below are additional advices not related to a particular MediaWiki release, but rather general best practices. <div class="mw-heading mw-heading3"><h3 id="Avoid_document.write()" data-mw-thread-id="h-Avoid_document.write()-Best_practices">Avoid document.write()</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=99" title="Edit section: Avoid document.write()">edit</a>]</div> Do not use this method, as it can cause a page to become visually blanked. Instead, use <a rel="nofollow" class="external text" href="http://api.jquery.com/">jQuery</a> to modify the document (adding elements, changing things etc.). To load external resources, use the import/loader functions instead. Example: replace <div class="errorbox"> <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>document.write('<script type="text/javascript" src="' + 'https://commons.wikimedia.org/w/index.php?title=MediaWiki:Gadget-HotCat.js' + '&action=raw&ctype=text/javascript"></script>'); </pre></div> </div> with <div class="successbox"> <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>mw.loader.load('https://commons.wikimedia.org/w/index.php?title=MediaWiki:Gadget-HotCat.js&action=raw&ctype=text/javascript'); </pre></div> </div> <div class="mw-heading mw-heading3"><h3 id="Event_binding" data-mw-thread-id="h-Event_binding-Best_practices">Event binding</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=100" title="Edit section: Event binding">edit</a>]</div> Binding input events to callback functions can be hard to do in cross-browser compatible way for all browsers that MediaWiki supports. It is recommended that you use <a rel="nofollow" class="external text" href="http://api.jquery.com/category/events/">jQuery for event binding</a>. See the <a href="/wiki/RL/JD#addHandler" class="mw-redirect" title="RL/JD">JavaScript deprecation overview on "addHandler"</a> for examples. <div class="mw-heading mw-heading3"><h3 id="Encoding_and_escaping" data-mw-thread-id="h-Encoding_and_escaping-Best_practices">Encoding and escaping</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=101" title="Edit section: Encoding and escaping">edit</a>]</div> When working with regular expressions, user input and/or urls must always be encoded or escaped. <ul><li>Regexes: <code><a href="/wiki/RL/DM#mediawiki.util" class="mw-redirect" title="RL/DM">mw.util.escapeRegExp</a></code> (provided by <code>mediawiki.util</code> module).</li> <li>HTML: <code><a href="/wiki/RL/DM#mw.html" class="mw-redirect" title="RL/DM">mw.html.escape</a></code> (provided by default).</li> <li>URL: <code><a href="/wiki/RL/DM#wikiUrlencode" class="mw-redirect" title="RL/DM">mw.util.wikiUrlencode</a></code> for page titles, <code><a href="/wiki/RL/DM#rawurlencode" class="mw-redirect" title="RL/DM">mw.util.rawurlencode</a></code> for other values (provided by <code>mediawiki.util</code> module).</li></ul> <div class="mw-heading mw-heading3"><h3 id="Prototyping" data-mw-thread-id="h-Prototyping-Best_practices">Prototyping</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=102" title="Edit section: Prototyping">edit</a>]</div> Do not extend native JavaScript constructors with non-standard methods (e.g. <code>String.prototype.foobar</code>, <code>Regex.myMethod</code>, <code>Array.prototype.inArray</code> etc.). Such non-standard methods should be defined in your own namespace instead, for example <code>MyThing.foobar</code>, or using module.exports/require. <div class="mw-heading mw-heading4"><h4 id="Polyfills" data-mw-thread-id="h-Polyfills-Prototyping">Polyfills</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=103" title="Edit section: Polyfills">edit</a>]</div> Before 2015, it was common for user scripts and gadgets to define fallback method for standard features of newer JavaScript engines. This is no longer needed in most cases, because the <a href="/wiki/ResourceLoader/Developing_with_ResourceLoader#Base_environment" title="ResourceLoader/Developing with ResourceLoader">Base environment</a> already ensures ES5 or later. This means ES5 methods such as <code>String#trim</code> and <code>Array#forEach</code> can be used directly. Before MediaWiki 1.32, the <a rel="nofollow" class="external text" href="https://github.com/es-shims/es5-shim#shims">es5-shim</a> module was bundled with MediaWiki to automatically define polyfills if needed. It could be used like so: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>// This using() command will immediately execute as "then()" in modern browsers. // In older browsers, it loads es5-shim.js first, and then executes your "then()". mw.loader.using( 'es5-shim').then( function () { console.log( ' bar '.trim() ); // "bar" [ 'a', 'b' ].forEach( function ( val ) { /* .. */ } ); } ); </pre></div> <div class="mw-heading mw-heading3"><h3 id="Getting_URL_parameter_values" data-mw-thread-id="h-Getting_URL_parameter_values-Best_practices">Getting URL parameter values</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=104" title="Edit section: Getting URL parameter values">edit</a>]</div> Functions like getURLParamValue, getParamVal, getParamValue, etc. are very common across wikis. Some are better than others (i.e. what if a parameter appears twice? (it should return the last one), does it ignore anything after the #tag?). As of 1.17 <code><a href="/wiki/RL/DM#getParamValue" class="mw-redirect" title="RL/DM">mw.util.getParamValue</a></code> is available everywhere and takes these factors into account. Perform a full-text all-namespace search for these function names. If they are widely used perhaps make a note about it in the local village pump. Any site-wide scripts should be updated to use the mw.util function. If there are any serious problems with the local implementation (like not escaping the value for regex), it may be wise to redirect the function: <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>function getURLParamValue( p, url ) { return mw.util.getParamValue( p, url ); } </pre></div> <div class="mw-heading mw-heading3"><h3 id="Avoid_use_of_!important" data-mw-thread-id="h-Avoid_use_of_!important-Best_practices">Avoid use of !important</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=105" title="Edit section: Avoid use of !important">edit</a>]</div> CSS stands for Cascading Style Sheets. Cascading means what comes later overwrites what came earlier. In most cases there is no need to use <code>!important</code>. See the following example: <div class="mw-highlight mw-highlight-lang-css mw-content-ltr" dir="ltr"><pre>.my-element { color: blue; } .my-element { color: green; } </pre></div> Text inside <code class="mw-highlight mw-highlight-lang-html mw-content-ltr" dir="ltr"><strong class="my-element"></code> will now be green. <div class="mw-heading mw-heading3"><h3 id="Keep_gadgets_central" data-mw-thread-id="h-Keep_gadgets_central-Best_practices">Keep gadgets central</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=106" title="Edit section: Keep gadgets central">edit</a>]</div> Use Meta.wikimedia.org or MediaWiki.org to store Gadgets' code, then import it into various local mediawiki. Interface administrators: To update a gadget on your wiki: <ul><li>Check MediaWiki:Gadgets-definition on your wiki and find the gadget in question.</li> <li>The part after the pipe (<code>|</code>) is the scriptname (eg. "<code>UTCLiveClock.js</code>").</li> <li>Go to MediaWiki:Gadget-<scriptname> (eg. <a href="/wiki/MediaWiki:Gadget-UTCLiveClock.js" title="MediaWiki:Gadget-UTCLiveClock.js">MediaWiki:Gadget-UTCLiveClock.js</a>)</li> <li>Remove everything and replace with the code in they grey area below the scriptname in the list. For an example on how this is done, check out <a class="external text" href="https://simple.wikipedia.org/wiki/MediaWiki:Gadget-LiveClock.js?action=edit">LiveClock on Simple Wikipedia</a>.</li></ul> Below is a list of gadgets that are : <ul><li>centrally stored</li> <li>compatible with 1.17</li> <li>work in Monobook and Vector</li> <li>can be loaded into any mediawiki, from WMF or external.</li></ul> <div class="mw-heading mw-heading4"><h4 id="Gadgets" data-mw-thread-id="h-Gadgets-Keep_gadgets_central">Gadgets</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=107" title="Edit section: Gadgets">edit</a>]</div> <ul><li>UTCLiveClock <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>mw.loader.load('https://www.mediawiki.org/w/index.php?title=MediaWiki:Gadget-UTCLiveClock.js&action=raw&ctype=text/javascript'); </pre></div></li> <li>contribsrange <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>mw.loader.load('https://www.mediawiki.org/w/index.php?title=MediaWiki:Gadget-contribsrange.js&action=raw&ctype=text/javascript'); </pre></div></li> <li>modrollback <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>mw.loader.load('https://www.mediawiki.org/w/index.php?title=MediaWiki:Gadget-modrollback.js&action=raw&ctype=text/javascript'); </pre></div></li> <li>QPreview <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>mw.loader.load('https://commons.wikimedia.org/w/index.php?title=MediaWiki:Gadget-QPreview.js&action=raw&ctype=text/javascript'); </pre></div></li> <li>ShortDiff <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>mw.loader.load('https://meta.wikimedia.org/w/index.php?title=MediaWiki:Gadget-ShortDiff.js&action=raw&ctype=text/javascript'); </pre></div></li> <li>lastdiff Check <a href="/wiki/Snippets/Last_revision_action" title="Snippets/Last revision action">Snippets/Last revision action</a></li> <li>HotCat</li></ul> <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>/** * This imports the latest version of HotCat from Commons. * HotCat is a gadget to make changes to categories much easier. * Full documentation can be found at https://commons.wikimedia.org/wiki/Help:Gadget-HotCat */ mw.loader.load('https://commons.wikimedia.org/w/index.php?title=MediaWiki:Gadget-HotCat.js&action=raw&ctype=text/javascript'); </pre></div> <ul><li>WikiMiniAtlas</li></ul> <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>/** * WikiMiniAtlas is a popup click and drag world map. * See [[meta:WikiMiniAtlas]] for more information. * Maintainers: [[w:User:Dschwen]] */ mw.loader.load('https://meta.wikimedia.org/w/index.php?title=MediaWiki:Wikiminiatlas.js&action=raw&ctype=text/javascript'); </pre></div> <ul><li>Navigation Popups (MediaWiki:Gadget-popups.js and MediaWiki:Gadget-popups.css respectively)</li></ul> <div class="mw-highlight mw-highlight-lang-javascript mw-content-ltr" dir="ltr"><pre>mw.loader.load('https://en.wikipedia.org/w/index.php?title=MediaWiki:Gadget-popups.js&action=raw&ctype=text/javascript'); </pre></div> <div class="mw-highlight mw-highlight-lang-css mw-content-ltr" dir="ltr"><pre>@import url('https://en.wikipedia.org/w/index.php?title=MediaWiki:Gadget-navpop.css&action=raw&ctype=text/css'); </pre></div> <div class="mw-heading mw-heading4"><h4 id="jQuery_optimization" data-mw-thread-id="h-jQuery_optimization-Keep_gadgets_central">jQuery optimization</h4>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=108" title="Edit section: jQuery optimization">edit</a>]</div> <ul><li><a href="/wiki/Optimization_for_jQuery" class="mw-redirect" title="Optimization for jQuery">Optimization for jQuery</a></li> <li><a rel="nofollow" class="external text" href="http://paulirish.com/perf/">jQuery for Performance & Common mistakes</a></li> <li><a rel="nofollow" class="external free" href="https://www.smashingmagazine.com/2008/09/16/jquery-examples-and-best-practices/">http://www.smashingmagazine.com/2008/09/16/jquery-examples-and-best-practices/</a></li></ul> <div class="mw-heading mw-heading3"><h3 id="Use_API_instead_of_index.php" data-mw-thread-id="h-Use_API_instead_of_index.php-Best_practices">Use API instead of index.php</h3>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=109" title="Edit section: Use API instead of index.php">edit</a>]</div> XML retrieved by invoking GET and POST methods on index.php is incompatible with HTML 5, which is the default as of 1.16 (and WMF sites since <a href="https://phabricator.wikimedia.org/T29478" class="extiw" title="phab:T29478">17th of September, 2012</a>). You should update code to use <a href="/wiki/API:Main_page" title="API:Main page">api.php</a>, JSON format and jQuery.ajax immediately. Use the ResourceLoader modules that do this for you to simplify interactng with the API, including <a href="/wiki/ResourceLoader/Modules#mediawiki.api" class="mw-redirect" title="ResourceLoader/Modules">mediawiki.api</a>. A temporary fix for problems with DOM parsing of XML retrieved via AJAX: For example the method <code>getElementById("foobar")</code> on a XML object from Mozilla's DOMParser stopped to work as before. Replacing the <code>getElementById</code> with <code>$('#foobar', client.responseText).get(0)</code> might work without many other changes to your code. Updating your script to the above mentioned methods is strongly recommended, however. <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="Conventions" data-mw-thread-id="h-Conventions">Conventions</h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=110" title="Edit section: Conventions">edit</a>]</div> <ul><li><a href="/wiki/Manual:Coding_conventions/JavaScript" title="Manual:Coding conventions/JavaScript">Manual:Coding conventions/JavaScript</a> – keep if statements with brackets, use proper indention (block B in block A is indented more, visualize the tree), etc.</li> <li><a href="/wiki/Manual:Coding_conventions/CSS" title="Manual:Coding conventions/CSS">Manual:Coding conventions/CSS</a> – combine selectors, remove stuff now in core, etc.</li></ul> <div class="mw-heading mw-heading2 ext-discussiontools-init-section"><h2 id="See_also" data-mw-thread-id="h-See_also">See also</h2>[<a href="/w/index.php?title=ResourceLoader/Migration_guide_(users)&action=edit&section=111" title="Edit section: See also">edit</a>]</div> <ul><li><a href="https://en.wikipedia.org/wiki/de:Wikipedia:Technik/Skin/JS/Obsolet" class="extiw" title="w:de:Wikipedia:Technik/Skin/JS/Obsolet">w:de:Wikipedia:Technik/Skin/JS/Obsolet</a></li></ul>    </div><noscript><img src="https://login.wikimedia.org/wiki/Special:CentralAutoLogin/start?type=1x1" alt="" width="1" height="1" style="border: none; position: absolute;"></noscript> <div class="printfooter" data-nosnippet="">Retrieved from "<a dir="ltr" href="https://www.mediawiki.org/w/index.php?title=ResourceLoader/Migration_guide_(users)&oldid=6795381">https://www.mediawiki.org/w/index.php?title=ResourceLoader/Migration_guide_(users)&oldid=6795381</a>"</div></div> <div id="catlinks" class="catlinks" data-mw="interface"><div id="mw-normal-catlinks" class="mw-normal-catlinks"><a href="/wiki/Special:Categories" title="Special:Categories">Category</a>: <ul><li><a href="/wiki/Category:ResourceLoader" title="Category:ResourceLoader">ResourceLoader</a></li></ul></div><div id="mw-hidden-catlinks" class="mw-hidden-catlinks mw-hidden-cats-hidden">Hidden category: <ul><li><a href="/wiki/Category:Pages_containing_potentially_dated_statements" title="Category:Pages containing potentially dated statements">Pages containing potentially dated statements</a></li></ul></div></div> </div> </main> </div> <div class="mw-footer-container"> <footer id="footer" class="mw-footer" > <ul id="footer-info"> <li id="footer-info-lastmod"> This page was last edited on 12 October 2024, at 21:09.</li> <li id="footer-info-copyright">Text is available under the <a rel="nofollow" class="external text" href="https://creativecommons.org/licenses/by-sa/4.0/deed.en">Creative Commons Attribution-ShareAlike License</a>; additional terms may apply. Text in <a class="external text" href="https://www.mediawiki.org/wiki/Special:MyLanguage/Help:Contents">the Help: namespace</a> is available under the <a rel="nofollow" class="external text" href="https://creativecommons.org/publicdomain/zero/1.0/">Creative Commons CC0 License</a>. By using this site, you agree to the <a class="external text" href="https://foundation.wikimedia.org/wiki/Special:MyLanguage/Policy:Terms_of_Use">Terms of Use</a> and <a class="external text" href="https://foundation.wikimedia.org/wiki/Special:MyLanguage/Policy:Privacy_policy">Privacy Policy</a>.</li> </ul> <ul id="footer-places"> <li id="footer-places-privacy"><a href="https://foundation.wikimedia.org/wiki/Special:MyLanguage/Policy:Privacy_policy">Privacy policy</a></li> <li id="footer-places-about"><a href="/wiki/Project:About">About mediawiki.org</a></li> <li id="footer-places-disclaimers"><a href="/wiki/Project:General_disclaimer">Disclaimers</a></li> <li id="footer-places-wm-codeofconduct"><a href="https://www.mediawiki.org/wiki/Special:MyLanguage/Code_of_Conduct">Code of Conduct</a></li> <li id="footer-places-developers"><a href="https://developer.wikimedia.org">Developers</a></li> <li id="footer-places-statslink"><a href="https://stats.wikimedia.org/#/www.mediawiki.org">Statistics</a></li> <li id="footer-places-cookiestatement"><a href="https://foundation.wikimedia.org/wiki/Special:MyLanguage/Policy:Cookie_statement">Cookie statement</a></li> <li id="footer-places-mobileview"><a href="//m.mediawiki.org/w/index.php?title=ResourceLoader/Migration_guide_(users)&mobileaction=toggle_view_mobile" class="noprint stopMobileRedirectToggle">Mobile view</a></li> </ul> <ul id="footer-icons" class="noprint"> <li id="footer-copyrightico"><a href="https://wikimediafoundation.org/" class="cdx-button cdx-button--fake-button cdx-button--size-large cdx-button--fake-button--enabled"><img src="/static/images/footer/wikimedia-button.svg" width="84" height="29" alt="Wikimedia Foundation" loading="lazy"></a></li> <li id="footer-poweredbyico"><a href="https://www.mediawiki.org/" class="cdx-button cdx-button--fake-button cdx-button--size-large cdx-button--fake-button--enabled"><img src="/w/resources/assets/poweredby_mediawiki.svg" alt="Powered by MediaWiki" width="88" height="31" loading="lazy"></a></li> </ul> </footer> </div> </div> </div> <div class="vector-settings" id="p-dock-bottom"> <ul></ul> </div><script>(RLQ=window.RLQ||[]).push(function(){mw.config.set({"wgHostname":"mw-web.codfw.main-f69cdc8f6-7dxkw","wgBackendResponseTime":268,"wgDiscussionToolsPageThreads":[{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.43","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-mediawiki.Uri-MediaWiki_1.43","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.41","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-jquery.cookie-MediaWiki_1.41","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.39","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-jquery.hoverIntent-MediaWiki_1.39","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.38","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-jquery.jStorage-MediaWiki_1.38","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Package_Gadgets-MediaWiki_1.38","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.37","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-jQuery_Migrate_3-MediaWiki_1.37","replies":[{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-$wgIncludejQueryMigrate-jQuery_Migrate_3","replies":[]}]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.36","replies":[]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.35","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-user.tokens_module-MediaWiki_1.35","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-mediawiki.notify-MediaWiki_1.35","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.34","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Module_deprecations-MediaWiki_1.34","replies":[{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-jquery.ui.*-Module_deprecations","replies":[]},{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-accessKeyLabel-Module_deprecations","replies":[]},{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-mediawiki.RegExp-Module_deprecations","replies":[]},{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-jquery.tabIndex-Module_deprecations","replies":[]}]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-mw.user.tokens_editToken-MediaWiki_1.34","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.32","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Api_modules-MediaWiki_1.32","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-wikiGetlink-MediaWiki_1.32","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-wgEnableAPI-MediaWiki_1.32","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.31","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Internet_Explorer_10_browser-MediaWiki_1.31","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-jquery.placeholder-MediaWiki_1.31","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.30","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-jquery.mwExtension-MediaWiki_1.30","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.29","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Legacy_removals-MediaWiki_1.29","replies":[{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-How_to_migrate-Legacy_removals","replies":[]}]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Gadget_type-MediaWiki_1.29","replies":[{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-Background-Gadget_type","replies":[]},{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-What's_new-Gadget_type","replies":[]},{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-How_to_migrate_2-Gadget_type","replies":[]}]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Gadget_peers-MediaWiki_1.29","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Internet_Explorer_9_and_pre-ES5_browsers-MediaWiki_1.29","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.28","replies":[]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.27","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Legacy_default:_mediawiki.util-MediaWiki_1.27","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-bits.wikimedia.org-MediaWiki_1.27","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Internet_Explorer_8-MediaWiki_1.27","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.26","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Legacy_gadgets-MediaWiki_1.26","replies":[{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-Global_variables_are_not_global-Legacy_gadgets","replies":[]}]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Font_mw-geshi-MediaWiki_1.26","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Inline_scripts-MediaWiki_1.26","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.24","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Legacy_removals_2-MediaWiki_1.24","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Internet_Explorer-MediaWiki_1.24","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.20","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-mw.util.jsMessage-MediaWiki_1.20","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-New_diff_styles-MediaWiki_1.20","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.19","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-wikitable_style_updates-MediaWiki_1.19","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-File_page_checkered_background-MediaWiki_1.19","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Trackbacks-MediaWiki_1.19","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.18","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Protocol-relative_urls-MediaWiki_1.18","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-\"Enabled_by_default\"_(Gadgets_extension)-MediaWiki_1.18","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-mw.util.wikiScript-MediaWiki_1.18","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.17","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-jQuery-MediaWiki_1.17","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Tabs_(vector)-MediaWiki_1.17","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Adding_portlet_links-MediaWiki_1.17","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Toolbar-MediaWiki_1.17","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Sajax-MediaWiki_1.17","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Client_testing-MediaWiki_1.17","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Sysop_script-MediaWiki_1.17","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-mw.loader-MediaWiki_1.17","replies":[{"headingLevel":5,"name":"h-","type":"heading","level":0,"id":"h-Dependencies-mw.loader","replies":[]},{"headingLevel":5,"name":"h-","type":"heading","level":0,"id":"h-In_practice-mw.loader","replies":[]}]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Global_wg_variables-MediaWiki_1.17","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Ready,_onload,_hook-MediaWiki_1.17","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-New_CSS_declarations_in_core-MediaWiki_1.17","replies":[{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-Headings_overflow_hidden-New_CSS_declarations_in_core","replies":[]},{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-Italic_redirects-New_CSS_declarations_in_core","replies":[]},{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-wpSummary-New_CSS_declarations_in_core","replies":[]}]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-UsabilityInitiative_no_more-MediaWiki_1.17","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Preformatted_JS/CSS_pages-MediaWiki_1.17","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Table_sorter-MediaWiki_1.17","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-MediaWiki_1.16_and_before","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-importScript-MediaWiki_1.16_and_before","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-addPortletLink-MediaWiki_1.16_and_before","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-appendCSS-MediaWiki_1.16_and_before","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-HTML_bugs_in_core-MediaWiki_1.16_and_before","replies":[{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-html_lang-HTML_bugs_in_core","replies":[]}]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-CSS_declarations_new_in_core-MediaWiki_1.16_and_before","replies":[{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-wikitable-CSS_declarations_new_in_core","replies":[]},{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-plainlinks-CSS_declarations_new_in_core","replies":[]},{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-mw-plusminus-CSS_declarations_new_in_core","replies":[]},{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-External_URLs-CSS_declarations_new_in_core","replies":[]}]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Tooltip_and_accesskeys-MediaWiki_1.16_and_before","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-Best_practices","replies":[{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Avoid_document.write()-Best_practices","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Event_binding-Best_practices","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Encoding_and_escaping-Best_practices","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Prototyping-Best_practices","replies":[{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-Polyfills-Prototyping","replies":[]}]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Getting_URL_parameter_values-Best_practices","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Avoid_use_of_!important-Best_practices","replies":[]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Keep_gadgets_central-Best_practices","replies":[{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-Gadgets-Keep_gadgets_central","replies":[]},{"headingLevel":4,"name":"h-","type":"heading","level":0,"id":"h-jQuery_optimization-Keep_gadgets_central","replies":[]}]},{"headingLevel":3,"name":"h-","type":"heading","level":0,"id":"h-Use_API_instead_of_index.php-Best_practices","replies":[]}]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-Conventions","replies":[]},{"headingLevel":2,"name":"h-","type":"heading","level":0,"id":"h-See_also","replies":[]}],"wgPageParseReport":{"discussiontools":{"limitreport-timeusage":"0.215"},"limitreport":{"cputime":"1.379","walltime":"7.332","ppvisitednodes":{"value":5823,"limit":1000000},"postexpandincludesize":{"value":50077,"limit":2097152},"templateargumentsize":{"value":13203,"limit":2097152},"expansiondepth":{"value":15,"limit":100},"expensivefunctioncount":{"value":124,"limit":500},"unstrip-depth":{"value":0,"limit":20},"unstrip-size":{"value":86121,"limit":5000000},"entityaccesscount":{"value":0,"limit":400},"timingprofile":["100.00% 6572.718 1 -total"," 7.47% 491.267 37 Template:Ll"," 5.22% 342.822 5 Template:ImportGadget"," 1.94% 127.249 86 Template:Anchor"," 1.88% 123.682 1 Template:ResourceLoader_navigation"," 1.80% 118.478 1 Template:Sidebar"," 1.51% 99.558 38 Template:Pagelang"," 1.47% 96.789 74 Template:Translatable"," 1.35% 88.567 19 Template:TNTN"," 1.34% 88.069 1 Translations:MediaWiki_1.19/Page_display_title/en"]},"scribunto":{"limitreport-timeusage":{"value":"0.195","limit":"10.000"},"limitreport-memusage":{"value":1284015,"limit":52428800}},"cachereport":{"origin":"mw-web.codfw.main-66695f89d8-bwgcq","timestamp":"20241119180022","ttl":2592000,"transientcontent":false}}});});</script> </body> </html>