file_pickerが勝手に生成するタグを非表示にする

README.md

@@ -18,3 +18,6 @@ binフォルダにおけばブラウザが立ち上がらない
   -   列数があってない
   -   拡張子：これはアップロードするときにできる
   -   必須項目が空
+
+## input file
+https://developer.mozilla.org/ja/docs/Web/HTML/Element/input/file

lib/file_picker_ appearance.dart

@@ -1,22 +1,31 @@
+import 'dart:html';
+
 import 'package:flutter/material.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:file_picker/file_picker.dart';
 
+/// file_pickerが勝手に生成するタグを非表示にする
+
 Future<void> main() async {
-  await chooseFileUsingFilePicker();
   runApp(ProviderScope(
       child: MaterialApp(
     home: MyApp(),
   )));
 }
 
+makeInvisible() {
+  final target = querySelector('#__file_picker_web-file-input');
+  target!.setAttribute('style', 'display:none');
+}
+
 Future<PlatformFile?> chooseFileUsingFilePicker() async {
   final result = await FilePicker.platform.pickFiles(
     allowedExtensions: ['csv'],
     type: FileType.custom,
     withReadStream: true,
   );
+  makeInvisible();
   if (result != null) {
     return result.files.single;
   } else {
@@ -27,6 +36,12 @@ Future<PlatformFile?> chooseFileUsingFilePicker() async {
 class MyApp extends HookWidget {
   @override
   Widget build(BuildContext context) {
-    return Container();
+    return Center(
+        child: ElevatedButton(
+      onPressed: () async {
+        await chooseFileUsingFilePicker();
+      },
+      child: Text('choose'),
+    ));
   }
 }

web/index.html

@@ -33,6 +33,7 @@
   <script src="https://www.gstatic.com/firebasejs/7.20.0/firebase-app.js"></script>
   <script src="https://www.gstatic.com/firebasejs/7.20.0/firebase-auth.js"></script>
   <script src="https://www.gstatic.com/firebasejs/7.20.0/firebase-storage.js"></script>
+  <script src="https://www.gstatic.com/firebasejs/7.20.0/firebase-analytics.js"></script>
 
   <script type="module">
     // Your web app's Firebase configuration