SCORM in React Iframe can't find API

I'm new to Scorm and I have a hard time understanding the little information I find online on this.

I'm using React with TS on this. My component looks something like this:

import React, { useEffect, useState } from "react";
import { scorm } from "@gamestdio/scorm";

const App: React.FC = () => {
  const [score, setScore] = useState<number | null>(null);
  const [completionStatus, setCompletionStatus] = useState<string | null>(null);

  useEffect(() => {
    // Initialize the SCORM API when the component mounts
    if (scorm.initialize()) {
      // SCORM API initialized successfully
      const rawScore = scorm.get("cmi.score.raw");
      setScore(rawScore !== null ? parseInt(rawScore, 10) : null);

      // Get the completion status from the SCORM package
      const status = scorm.get("cmi.completion_status");
      setCompletionStatus(status);
    } else {
      // SCORM API failed to initialize
      console.error("SCORM API initialization failed");
    }

    // Don't forget to terminate the SCORM API when the component unmounts
    return () => {
      scorm.terminate();
    };
  }, []);

  return (
    <div>
      <h1>
        {score} {completionStatus}
      </h1>
      <iframe
        id="scormIframe"
        title="SCORM Package"
        src="Website/index.html"
        width="800"
        height="600"
      />
    </div>
  );
};

export default App;

The error I'm getting is this:

connection.initialize called.
SCORM.API.find: Error finding API.
Find attempts: 0.
Find attempt limit: 500
getAPI failed: Can't find the API!
scorm.initialize failed: API is null.

The Iframe works just fine. I have tried the variant where I initialize it after the iframe loads and still the same result. There are no CORS problems. I'm sure it something very essential I'm missing but I just don't get what.

The SCORM API is provided in the parent window/frame by the learning management system. The course looks for the API on launch. If you're testing locally, outside of an LMS, there is no API to connect to, therefore the errors, because the SCORM wrapper you're using can't find the API in the parent window/frame.

Be sure to test in a real LMS environment. SCORM Cloud is a free an easy way to give it a try.