How to include JS file in a custom view in infolist?

I find it hard to make it working.. the case is I want to use video JS on my video player.

Since we are using CDN for video JS, I register it in AdminPanelProvider.

 public function boot(): void
    {
        FilamentAsset::register([
            Js::make('video-js', 'https://cdn.jsdelivr.net/npm/[email protected]/dist/video.min.js'),
            Js::make('videojs-contrib-eme', 'https://cdn.jsdelivr.net/npm/[email protected]/dist/videojs-contrib-eme.min.js'),

            Css::make('video-css', 'https://cdn.jsdelivr.net/npm/[email protected]/dist/video-js.min.css'),
        ]);

    }

On my relationship manager inforlist

//App/Filament/Resources/SeriesResource/RelationManagers/EpisodesRelationManager;

public function infolist(Infolist $infolist): Infolist
    {
        return $infolist
            ->schema([
                View::make('filament.pages.series.episodes.video')
                    ->columnSpanFull()
                    ->viewData(['drmData' => $this->drmData])
            ]);
    }

On my custom view, I tried this... I put the script here because I want the script to only trigger here

@if($getRecord())
    <div class="h-screen flex justify-center gap-3 w-full">
        <div class="h-screen aspect-video ">
            <video
                id="my-video"
                class="video-js vjs-default-skin vjs-16-9"
                controls
                preload="auto"
                width="640"
                height="264">
                <source src="{{ $getRecord()->video?->full_url }}" type="video/mp4">
            </video>

        </div>
    </div>
    <script>
        document.addEventListener('DOMContentLoaded', () => {
            console.log("Video.js initialization script is running"); // Debugging message
            const player = videojs('my-video');
            console.log("Player instance:", player); // Log the player instance
        });
    </script>

@endif

As I check in the devtools console there is no console message

My question is, where to put the script?

This is the native laravel that we take as guide

<!DOCTYPE html>
<html>

<head>
    <title>VideoJS PallyCon Multi-DRM Sample</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="css/mvp.css">
    <link rel="stylesheet" href="css/scrolldown.css">

    <!-- VideoJS library and css -->
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/video.min.js"></script>
    <script src="https://cdn.tailwindcss.com"></script>
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/video-js.min.css" rel="stylesheet" />
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/videojs-contrib-eme.min.js"></script>
</head>

<body>
    <main>
        <div class="flex justify-center mb-10">
            <code id="browserCheckResult"></code>
        </div>

        <div class="flex justify-center">
            <video id="my-player" class="video-js vjs-default-skin vjs-16-9" controls data-setup="{}" />
        </div>
    </main>
</body>

<script>
    var drmData = {!! json_encode($drmData, JSON_HEX_TAG) !!};
</script>

<script type="text/javascript" src="js/pallycon-sample-helper.js"></script>
<script type="text/javascript" src="js/videojs-sample.js"></script>

</html>

Please or to participate in this conversation.