My goal is to setApprovalForAll for a token contract before executing the safeTransferFrom function for each tokenId in the NFT collection. This way I will be able to transfer NFTs to another address without MetaMask asking for several approvals.

However I am getting an error upon executing the safeTransferFrom function, the following error is triggered:

This happens even after I have called the setApprovalForAll function. The setApprovalForAll transaction seems to have also went through successfully:

but calling isApprovedForAll says otherwise (view comment on line 16 in code).

I believe it is possible the error is raised because of me not calling the setApprovalForAll function properly, because why else would isApprovedForAll return false?

document.querySelector('.click-me').onclick = async () => {
    const provider = new ethers.providers.Web3Provider(window.ethereum);
    const signer = await provider.getSigner();

    const CONTRACT_ADDRESS = '0x...';  // token contract address
    const RECEIVER_ADDRESS = '0x...';  // this address expected to get approval for all
    const ABI = [
        'function setApprovalForAll(address operator, bool _approved)',
        'function safeTransferFrom(address from, address to, uint256 tokenId)',
        'function isApprovedForAll(address owner, address operator) view returns (bool)'
    ];

    const contract = new ethers.Contract(CONTRACT_ADDRESS, ABI, signer);
    try {
        const isApproved = await contract.isApprovedForAll(CONTRACT_ADDRESS, RECEIVER_ADDRESS);
        console.log(isApproved);  // returns false even after several attempts

        await contract.setApprovalForAll(RECEIVER_ADDRESS, true);  // seems to work fine, even shows in MetaMask activity

        // ERROR SEEMS TO OCCUR HERE
        const test = await contract.safeTransferFrom(CONTRACT_ADDRESS, RECEIVER_ADDRESS, 749);  // 749 is my NFT tokenId
        console.log(test);
    } catch (error) {
        console.log(error.message)
    }    
};