title: Send to Messenger button not showing
body: <p>I am trying to use the Send to Messenger plugin but it is not rendered if I try to initialize it with another FB user's page ID and my messenger app ID. This user has already given me permission to manage his pages so I obtain the page ID from one of them (he chooses which). There is nothing in the Messenger docs about this scenario..</p>
  
  <p>Here is how I do it:</p>
  
  <p>Flow:</p>
  
  <ol>
  <li>The user logs in using Facebook Login with the Facebook SDK. He gives me manage_pages permission.</li>
  <li>I fetch his pages with FB.api('/me/accounts') and display them to the user</li>
  <li>User selects one of these pages</li>
  <li>I create a Send to Messenger plugin element with the selected page ID and my app ID, then call FB.XFBML.parse() to render the plugin. This does not work if the page is not connected to the app it seems.</li>
  </ol>
  
  <p>My messenger bot is not published (still in development).</p>
  
  <p>Things I tried already with no results:
  - tried with test users I created in my app
  - tried giving the user a Tester role in my app's settings</p>
  
  <p>Code:</p>
  
  <pre><code>&lt;html&gt;
  &lt;body&gt;
      &lt;script&gt;
          // If user is logged in to FB get his pages
          function statusChangeCallback(response) {
              if (response.status === 'connected') {
                  fetchPages();
              }
          }
  
          // Login listener
          function checkLoginState() {
              FB.getLoginStatus(function(response) {
                  statusChangeCallback(response);
              });
          }
  
          // Initialize FB
          window.fbAsyncInit = function() {
              FB.init({
                  appId: 'XXXX',
                  cookie: true,
                  xfbml: true,
                  version: 'v2.6'
              });
  
              FB.getLoginStatus(function(response) {
                  statusChangeCallback(response);
              });
          };
  
          // Load the SDK asynchronously
          (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 = "//connect.facebook.net/en_US/sdk.js";
              fjs.parentNode.insertBefore(js, fjs);
          }(document, 'script', 'facebook-jssdk'));
  
          function fetchPages() {
              FB.api('/me/accounts', function(response) {
  
                  if (response &amp;&amp; response.data &amp;&amp; !response.error) {
  
                      // Get all pages managed by the logged in user
                      var pages = response.data;
                      var pageIds = [];
                      pageList.innerHTML = '';
  
                      // User selects one of these pages, let's say first one
                      var selectedPage = pages[0];
  
                      var pageSelector = document.getElementById('pageSelector');
                      pageSelector.addEventListener("click", function() {
  
                          // Create the Send to Messenger element with
                          // messenger_app_id: my app's ID
                          // page_id: ID of the selected page
                          var sendToMessengerWrapper = document.getElementById('sendToMessengerWrapper');
                          sendToMessengerWrapper.innerHTML = '';
  
                          var plugin = document.createElement('div');
                          plugin.setAttribute('class', 'fb-send-to-messenger');
                          plugin.setAttribute('messenger_app_id', 'XXXX');
                          plugin.setAttribute('page_id', selectedPage.id);
                          plugin.setAttribute('data-ref', 'ref');
                          plugin.setAttribute('color', 'blue');
                          plugin.setAttribute('size', 'standard');
                          sendToMessengerWrapper.appendChild(plugin);
  
                          // Re-render the button - this only worked the for page directly connected to my app. 
                          FB.XFBML.parse(document.getElementById('sendToMessengerWrapper'));
                      });
                  }
              });
          }
      &lt;/script&gt;
  
      &lt;!-- Notice the permissions I am requesting --&gt;
      &lt;fb:login-button id="logInBtn" scope="manage_pages,pages_messaging,pages_messaging_phone_number" onlogin="checkLoginState();"&gt;
      &lt;/fb:login-button&gt;
  
      &lt;input type="button" id="pageSelector" value="Connect page"/&gt;
  
      &lt;!-- Plugin button should be rendered inside this element --&gt;
      &lt;div id="sendToMessengerWrapper"&gt;&lt;/div&gt;  
  
  &lt;/body&gt;
  </code></pre>
  
  <p></p>