Messenger plugin not visible in a dev mode

Question

I'm trying to add regular messenger plugin to the website: https://outrainer.pl

I have added standard code:

    <script>
      window.fbAsyncInit = function() {
        FB.init({
          appId            : '1957690761027872',
          autoLogAppEvents : true,
          xfbml            : true,
          version          : 'v7.0'
        });
        
      };
    </script>
    <script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js"></script>

    
    <script>
        (function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "https://connect.facebook.net/en_US/sdk/xfbml.customerchat.js";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));

    //FB.CustomerChat.showDialog();
    </script>

and required div:

<div class="fb-customerchat"
 page_id="100751868404123">
</div>

However I can not see a plugin. Moreover when I try to run "FB.CustomerChat" from webcsonsole, it returns "undefined". What am I missing?

Answer 1

https://developers.facebook.com/docs/messenger-platform/discovery/customer-chat-plugin/ or use the code generated via the setup tool in your page settings. The Customer Chat Plugin doesn't use the regular SDK anymore.