Solved - Automatically trigger SMS on MFA prompt screen

[thisisraman]

Problem statement -
SMS is a factor we have chosen to enable for our external customers. When users login, the screen that prompts the user to enter their factor is very misleading, as it expects the user to click on “SEND CODE” first. The default expectation is that the code is automatically sent when one reaches the screen.

I had raised an earlier issue - Customize MFA screen for SMS Authentication and the latest response was from @ronnelson .

Using the method Ron suggested, I was able to get the screens to automatically send the SMS. I couldn’t edit that post any longer, so I created this one so I can post the actual code that worked for me.
All I am doing is to check if the class sms-request-button exists, and if so, forcing the click.

I did see others in the community who had the same issue, and hopefully this helps. Thanks @ronnelson for the suggestion. I am a Javascript noob, so if anybody else has a suggestion to optimize the code, please feel free to publish the modified code.

var oktaSignIn = new OktaSignIn(config);
oktaSignIn.on('afterRender', function(context) {
      var smsGroup = document.getElementsByClassName("sms-request-button");
      if (smsGroup.length)  smsGroup[0].click();
});

[brh55]

Yep that looks good, just add a check to only occur on “mfa-verification”, this is how I implement “auto-send” within the SIW:

oktaSignIn.on('afterRender', function (context) {
    if (context.controller === 'mfa-verify') {
        // Alternative you can use document.getElementsByClassName 
        const requestCodeButton = document.querySelector('a.sms-request-button');
        if (requestCodeButton) {
            requestCodeButton.click();
        }
    }
});

By adding the conditional check around controller context, you’ll prevent unnecessary querying of the DOM for irrelevant views.