Ways to enable or disable async functions in the Facebook web SDK

Lately, I made a change in my app to transition from compiling async functions to simply using the regular async syntax. However, I've encountered an issue where I'm receiving an error message

Expression is of type asyncfunction, not function
from FB. sdk functions. For instance, when I try to call FB.login(async () => {}), it triggers this exception. This has led me to ponder whether we can:

  • 1 - restrict async expressions (?) statically (perhaps with Typescript) for the FB object
  • 2 - persuade Facebook to avoid unnecessary complications. The application shouldn't be concerned with distinguishing between a function expression and an async function expression (or any other types we might introduce).

Please note: My current workaround involves wrapping the function like so

FB.login((data) => (async () => {...}))
and including a comment explaining the reason behind this action. Nevertheless, this approach is quite delicate as there may be instances in the codebase where these functions are called without awareness of the underlying issue.

Answer №1

Dealing with a similar issue led me to the realization that the FB SDK does not play nice with asynchronous functions, as they seem to be stuck in 2010. To get around this limitation, I had to resort to using a regular function that subsequently calls an asynchronous function enclosed within its own try-catch block.

const myAsyncFunction = async (response) => {
 try {
     // Perform logic here...
   } catch (e) {}
}

 FB.login(function() {
    myAsyncFunction() // We don't await here
})

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the best way to ensure a navigation link stops scrolling at the bottom of a navbar that is set to position: sticky?

I am utilizing Bootstrap 5 for my website, and I have a sticky-top attribute on my navbar. When I click on one of the links in the navigation bar, the page scrolls to that section, but some of the content goes behind the navbar. I am looking for a way to m ...

Reset Vuetify form when dialog is opened

I'm currently facing an issue on a Vue page that utilizes the Vuetify framework. The problem arises with a button that triggers a dialog from a child component: <div id="app"> <v-app id="inspire"> <v-row justif ...

Ways to invoke a class method by clicking on it

My initialization function is defined as follows: init: function() { $("#editRow").click(function() { <code> } $(".removeRow").click(function() { <code> } } I am trying to find a way to call the class method removeRow directly in the onc ...

Having trouble sending the code through post message

I was trying to send some code to a node application using Postman with a POST message. In the body, I included the following code: module.exports = function() { var express = require('express'), app = express(); app.set('po ...

After sending the directories, an unusual issue arose that caught me off guard

Here is the code I have written:- const express = require("express"); const app = express(); app.get("/", function (req,res) { res.send("<h1>Hello World</h1>"); res.send(__dirname + '\\index. ...

What is the best way to create a mirrored effect for either a card or text using CSS

Can anyone assist me with this CSS issue? When I hover over to view the movie details, the entire word flips along with it. Is there a way to make only the word flip initially, and then have it return to normal when hovered? The HTML code is included belo ...

The functionality of Angular UI TimePicker is not functioning as expected

Currently, I am in the process of developing an angular directive that is designed to manage date and time functions. I have integrated Angular's UI Bootstrap into my project but have encountered a peculiar issue with the TimePicker component. While t ...

What is the correct way to declare the mongoose _id in a TypeScript interface?

I have a question about utilizing Mongoose and TypeScript using the interface+class+schema approach. When it comes to storing the _id field, what is the best method? I understand that the database stores it as a bson ObjectID. However, I've come acr ...

Steer clear of encountering the "$digest already in progress" issue

A custom directive named 'myPagination' has been implemented, which encapsulates the functionality of the UI Bootstrap's pagination directive. angular.module('my-module') .directive('myPagination', ['$filter' ...

When using JSON.Stringify in a React App, it only displays the first item and the length of the object instead of all the other items

Working on a React App, I encountered an issue while trying to convert an array to JSON and send it to the server. My approach was like this: console.log(JSON.stringify(mainArray)) I anticipated seeing output like this during testing: "breakfast": { ...

Using the jquery slider in conjunction with the onchange event

I have integrated a jquery slider add-on into my project that updates a value in a Linux file whenever it is manipulated. The slider is connected to a text input box, which is set as readonly and therefore always blurred. The issue I am facing is that the ...

HTML checkbox utilizing JavaScript

<input type="checkbox" name="smoker"> Is there a way for JavaScript to determine whether the checkbox is checked or unchecked without making changes to the HTML code above? ...

What causes inline CSS and internal CSS to exhibit different behaviors?

It’s kind of strange that I have to click twice to see Foo’s content, but only once to see Bar’s content. The main difference seems to be that Foo’s content has internal style while Bar has inline style. <html> <head> <style> ...

What could be the reason for the malfunction of .text() and .html() in cheerio js when used with node-fetch?

I am a beginner with Node JS and I am experimenting with the node-fetch and cheerio packages. My goal is to extract data from various websites by testing different URLs and selectors. However, in the code snippet below, regardless of the input selector or ...

Database entry does not appear in Internet Explorer until the browser is completely shut down and reopened

Currently, I have a form with two dropdowns. Selecting an option from the first dropdown automatically populates the second dropdown. Everything works well except for a minor issue I observed recently. When I add a new item to the second dropdown, it gets ...

What is the process by which Elastic Beanstalk executes Node.js application code?

While my application runs smoothly on localhost, encountering no issues, deploying it to other platforms such as AWS or MCS presents a challenge. Specifically, the problem lies in recognizing the file paths required by the consign library to load the route ...

Can you guide me on how to access an Angular route using a URL that includes query parameters?

Within my current development project, I have implemented a user profile route that dynamically navigates based on the user's _id. This means that when a user accesses the page, their _id is stored in localStorage and then used to query MongoDB for th ...

Is JavaScript utilizing Non-blocking I/O at the operating system level to enable AJAX functionality?

Given that Javascript operates as a single threaded process and AJAX functions asynchronously, the question arises: How does this happen? Is it possible that at the operating system level, the JS engine is responsible for making non-blocking I/O calls fo ...

What could be causing React to not re-render the page when the button is clicked?

function MyApp() { const [usersData, setUsersData] = useState([]) useAsyncEffect(async () => { const response = await fetch('https://jsonplaceholder.typicode.com/users') const users = await response.json() setU ...

Editable content tag

Is there a way to set the maximum number of rows in the contenteditable attribute? I would like to limit users once they reach the character capacity for sending data via POST method. I am currently working with HTML 5. Contenteditable is a new attribute ...