[web]: Text within an HtmlElementView by default is red #115216
Description
The default body text color mentioned in #58828 as an indicator if an app forgets to pick a style may have implications with content in web platform views, e.g. google_maps_flutter_web, even if a style is set on the Flutter side.
It's possible that the resolution would be to require embedded web platform views to do some degree of CSS reset, which might be worth calling out in documentation. There may be some related history in #67740 and #50452.
Potential documentation sites:
- https://api.flutter.dev/flutter/widgets/HtmlElementView-class.html
- Somewhere in https://docs.flutter.dev/development/platform-integration/web/
Steps to Reproduce
https://dartpad.dev/5661e339114f8e41950451dce63ebad7
- Repros on both stable and master on DartPad.
- Repros on master on both Chrome and Edge in debug and release locally. Also tested and repro'd on Chrome with HTML renderer in debug.
- Repros with or without
textTheme: Typography.blackMountainView.
Expected results: Text styling similar to user-agent default or the nearest Flutter Theme.
Actual results: Red text from the body text styling debug indicator.
Code sample
import 'dart:ui';
import 'dart:html';
import 'package:flutter/material.dart';
void main() {
platformViewRegistry.registerViewFactory(
'example', (_) => DivElement()..innerText = 'Hello, HTML!');
runApp(MaterialApp(
title: 'Example',
theme: ThemeData(colorSchemeSeed: const Color(0xff000000)),
home: Scaffold(
appBar: AppBar(
title: const Text('Example'),
),
body: Column(children: const [
Text('Hello, Flutter!'),
SizedBox(
width: 512,
height: 512,
child: HtmlElementView(viewType: 'example'))
]))));
}