Jquery steps: How to add title to steps?

Question

We are adding the next, back and submit button as follows using jquery steps:

form.steps({
    headerTag: "h3",
    bodyTag: "div",
    autoFocus: true,
    contentContainerTag: "div",
    titleTemplate: '<span>#title#</span>',
    transitionEffect: "fade",
    labels:{
     current:'',
     next: '<span class="button btn btn-sn-primary px-4 py-2">'+ $.mage.__('Next') +' <i class="fa fa-caret-right"></i></span>',
     previous: '<span class="button btn btn-sn-tertiary px-4 py-2"><i class="fa fa-caret-left"></i> ' + $.mage.__('Back') + '</span>',
     finish: '<span class="button btn btn-sn-primary px-4 py-2">' + $.mage.__('Submit') + '</span>'
    },
    onInit: function (event, currentIndex){

We are getting error on console:

Uncaught Error: One or more corresponding step titles are missing

What am I missing here?