Semantic-Org/Semantic-UI · error

Max recursive depth reached

Error message

Max recursive depth reached

What it means

Semantic UI Tab error logged at tab.js:632 inside get.defaultPath(). When a tab path is a parent that auto-expands to a default child, the module recurses to resolve the deepest default; once recursionDepth reaches settings.maxDepth, it stops and logs this error.

Source

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

  apiSettings     : false,      // settings for api call
  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',

View on GitHub (pinned to 597843ab84)

Solutions

1. Find and break the cycle in data-tab default-tab resolution.
2. Increase settings.maxDepth if the chain legitimately exceeds the default.
3. Audit dynamically generated tab attributes to ensure no recursive default loops.

Example fix

// before - cyclic defaults
// after - break the loop, or raise maxDepth
$('.menu .item').tab({ maxDepth: 10 });

function detectTabCycle(rootPath, maxN) {
  var seen = {}; var current = rootPath; var n = 0;
  while (current && !seen[current] && n < (maxN || 20)) {
    seen[current] = true;
    var next = document.querySelector('[data-tab="' + current + '"]');
    current = next ? next.getAttribute('data-tab') : null;
    n++;
  }
  return !!current && !!seen[current];
}

function isWithinMaxDepth(depth, max) { return depth <= (max || 5); }

When it happens

Trigger: A chain of tabs where data-tab="a/b", data-tab="a/b/c", etc. each declare the next as default, creating a cycle or a chain longer than maxDepth (default 5).

Common situations: Cyclic default-tab chains (a -> b -> a); deeply nested tab hierarchies beyond maxDepth; accidentally re-pointing data-tab attributes at runtime into a loop.

Related errors

• The tab you specified is missing a content url.
• History enabled, but no path was specified
• API action used but no url was defined
• No URL specified for api event
• The beforeSend callback must return a settings object, befor

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