chewie icon indicating copy to clipboard operation
chewie copied to clipboard

Web: Detect if the user has not interacted with the page yet

Open alexeyinkin opened this issue 1 year ago • 0 comments

On web, autoplay does not work if the user has not interacted with the page yet.

This example shows a broken video without the ability to play it:

import 'package:chewie/chewie.dart';
import 'package:flutter/material.dart';
import 'package:video_player/video_player.dart';

late VideoPlayerController videoPlayerController;
late ChewieController chewieController;
final routerDelegate = MyRouterDelegate();

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();

  videoPlayerController =
      VideoPlayerController.networkUrl(Uri.parse('https://flutter.github.io/assets-for-api-docs/assets/videos/bee.mp4'));

  await videoPlayerController.initialize();
  chewieController = ChewieController(
    videoPlayerController: videoPlayerController,
    autoPlay: true,
  );

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp.router(
      routerDelegate: routerDelegate,
    );
  }
}

class MyRouterDelegate extends RouterDelegate<Object>
    with ChangeNotifier, PopNavigatorRouterDelegateMixin<Object> {
  @override
  final GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();

  @override
  Widget build(BuildContext context) {
    return Navigator(
      pages: [
        MaterialPage(
          key: ValueKey('HomePage'),
          child: Chewie(controller: chewieController),
        ),
      ],
      onPopPage: (route, result) => true,
    );
  }

  @override
  Future<void> setNewRoutePath(configuration) async {}
}
Screenshot 2024-07-02 at 10 00 25

For some reason, I don't see an error in the console, but if I add print(e); to the error handler in video_player.dart, it shows this in Chrome:

NotAllowedError: play() failed because the user didn't interact with the document first. https://goo.gl/xX8pDD

I expect that if autoplay can't work I still have a functional player even if not started automatically.

This happens in the real world with deep linking when people share links to my video pages.

alexeyinkin avatar Jul 02 '24 06:07 alexeyinkin