Reintegrate iiif-av-component

[K8Sewell]

Description of what you did:

• Added tests to confirm AV behavior for simple video and video with structures in manifest
• Move iiif-av-component from dependency to now be fully incorporated into UV
• Fixed type-checking against jQuery 2 typings

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
universalviewer	Ready	Preview, Comment	Jul 2, 2026 4:31pm
universalviewer.dev	Ready	Preview, Comment	Jul 2, 2026 4:31pm

[LanieOkorodudu]

@K8Sewell, I had a proper look through the AV test structure, and I think it's a really solid approach. The dedicated page together with the full reload using about:blank solved the issue I was having with the viewer not reinitialising correctly, so thank you for putting that together!

I incorporated your approach and was able to get the correct manifest title to render as well. I also added a couple of extra assertions to verify that the canvas title displays "Video Example 3", and that the video can actually play, continue for around 10 seconds, and then pause successfully.

Having looked through it properly, I think your existing test already covers the AV functionality really well, so I don't think there's any need for me to duplicate it on my end.

Do you think it's worth adding the additional title and play/pause verification, or do you think these tests are sufficient as they are?

I'll also try using the same approach for the 3D manifest and hopefully that'll work there too. Thank you so much for all the work you've put into this. I really appreciate you sharing your approach with me!

This is what I added on my end:
// Verify the manifest title
const title = await avPage.$eval("#uv .mainPanel .centerPanel h1",
(el) => el.textContent.trim()
);
expect(title).toBe("Video Example 3");

// Verify play/pause behaviour
await avPage.click(".mejs__playpause-button button");

await avPage.waitForFunction(() => {
const video = document.querySelector("video");
return video && !video.paused;
});

const startTime = await avPage.$eval(
"video",
(video) => video.currentTime
);

// Let the video play for approximately 10 seconds
await avPage.waitForFunction(
(start) => {
const video = document.querySelector("video");
return video && video.currentTime > start + 10;
},
{ timeout: 20000 },
startTime
);

// Pause playback
await avPage.click(".mejs__playpause-button button");

await avPage.waitForFunction(() => {
const video = document.querySelector("video");
return video && video.paused;
});

const pausedTime = await avPage.$eval(
"video",
(video) => video.currentTime
);

expect(pausedTime).toBeGreaterThan(startTime + 10);

These are just a few ideas I tried, feel free to ignore it if you don't think it's necessary.😊

Sorry I commented on this PR but I should have write this comment on #1796