Semantic-Org/Semantic-UI · info

onTabInit has been renamed to onFirstLoad in 2.0, please adj

Error message

onTabInit has been renamed to onFirstLoad in 2.0, please adjust your code.

What it means

Semantic UI Tab deprecation notice logged at tab.js:172 by fix.callbacks(): if parameters.onTabInit is detected, it is renamed to parameters.onFirstLoad (the 2.x name), the legacy key is deleted, and this message is emitted. The migration is automatic; the message exists to push developers onto the new API.

Source

Thrown at src/definitions/modules/tab.js:929

  evaluateScripts : 'once',     // whether inline scripts should be parsed (true/false/once). Once will not re-evaluate on cached content

  onFirstLoad : function(tabPath, parameterArray, historyEvent) {}, // called first time loaded
  onLoad      : function(tabPath, parameterArray, historyEvent) {}, // called on every load
  onVisible   : function(tabPath, parameterArray, historyEvent) {}, // called every time tab visible
  onRequest   : function(tabPath, parameterArray, historyEvent) {}, // called ever time a tab beings loading remote content

  templates : {
    determineTitle: function(tabArray) {} // returns page title for path
  },

  error: {
    api        : 'You attempted to load content without API module',
    method     : 'The method you called is not defined',
    missingTab : 'Activated tab cannot be found. Tabs are case-sensitive.',
    noContent  : 'The tab you specified is missing a content url.',
    path       : 'History enabled, but no path was specified',
    recursion  : 'Max recursive depth reached',
    legacyInit : 'onTabInit has been renamed to onFirstLoad in 2.0, please adjust your code.',
    legacyLoad : 'onTabLoad has been renamed to onLoad in 2.0. Please adjust your code',
    state      : 'History requires Asual\'s Address library <https://github.com/asual/jquery-address>'
  },

  metadata : {
    tab    : 'tab',
    loaded : 'loaded',
    promise: 'promise'
  },

  className   : {
    loading : 'loading',
    active  : 'active'
  },

  selector    : {
    tabs : '.ui.tab',
    ui   : '.ui'

View on GitHub (pinned to 597843ab84)

Solutions

  1. Rename onTabInit to onFirstLoad in the tab settings object.
  2. Remove the now-deprecated key once the rename is in place.
  3. Update any documentation/comments referencing the old name.

Example fix

// before
$('.menu .item').tab({ onTabInit: function(path, params, evt){ /*...*/ } });
// after
$('.menu .item').tab({ onFirstLoad: function(path, params, evt){ /*...*/ } });
Defensive patterns

Strategy: validation

Validate before calling

function migrateTabCallbacks(cfg) {
  if (cfg && cfg.onTabInit) { console.warn('Rename onTabInit -> onFirstLoad'); cfg.onFirstLoad = cfg.onTabInit; delete cfg.onTabInit; }
  return cfg;
}

Type guard

function usesModernTabInitName(cfg) { return !cfg || typeof cfg.onTabInit === 'undefined'; }

Prevention

When it happens

Trigger: Initializing tab with the 1.x callback name: $('.menu .item').tab({ onTabInit: function(){...} }).

Common situations: Code from Semantic UI 1.x examples; legacy CMS templates; documentation predating the 2.0 rename.

Related errors


AI-assisted analysis of Semantic-Org/Semantic-UI@597843ab84 (2026-08-13). Data as JSON: /api/errors/3e24490564cfcb10. Report an issue: GitHub.