Testing React Native Functional Component With Dependency on Promise

I've got a functional component in React Native.

import { ReactElement, useEffect, useState } from "react-test-renderer/node_modules/@types/react";import SpecialObject from "./SpecialObject";import { getPromisedObject } from "./AccessFunctions";export function PromiseDependencyComponent(): ReactElement {  const [val, setVal] = useState<SpecialObject>(new SpecialObject());  const promisedVal: Promise<SpecialObject> = getPromisedObject();  useEffect(() => {    setInterval(() => {      promisedVal.then( (obj) =>        setVal(obj);       );    }, 250);  }, []);  return (<Text>{val.getSomeField()}</Text>);}

I'd like to be able to test that the promised SpecialObject is retrieved correctly when the component is rendered. This is what I've got now:

import * as React from "react";import renderer from "react-test-renderer";import PromiseDependencyComponent from "../PromiseDependencyComponent";it("PromiseDependencyComponent renders correctly", () => {  const componentRenderer = renderer.create(<PromiseDependencyComponent />);  // I've also tried using timers and componentRenderer.update() and neither worked for me.  const tree = componentRenderer.toJSON();  expect(tree).toMatchSnapshot();});

This test executes and nothing breaks, I'm just not seeing the same thing as I'm seeing when running the app. When I run the app, I see the promised value being displayed after a 250ms delay. But my problem is that I want to see the updated/promised value in my test snapshot.

So what I'm seeing in my app is something like this:

<!-- This the updated/promised SpecialObject. --><Text>5</Text>

But I'm getting something like this in my test snapshot:

<!-- This just comes from a new instance of SpecialObject, which is the initialized component state. --><Text>0</Text>

What's the simplest/cleanest way to invoke some sort of update on my component so that I can verify that the promise is fulfilled when the component is rendered?