Changing between material3 dark and light themes with different TextStyles raises Exception: AnimatedTheme(duration: 200ms, dirty, state: _AnimatedThemeState#f6b46(ticker active, ThemeDataTween(ThemeData#ee39f → ThemeData#99352)))

[mmahgoub]

Steps to Reproduce

1. Execute flutter run on the Counter app code sample below
2. Click increment. The app will crash
   Expected results:
   Switching dynamically between light and dark themes

Actual results:
═══════ Exception caught by widgets library ═══════════════════════════════════ The following assertion was thrown building AnimatedTheme(duration: 200ms, dirty, state: _AnimatedThemeState#f6b46(ticker active, ThemeDataTween(ThemeData#ee39f → ThemeData#99352))): 'package:flutter/src/painting/text_style.dart': Failed assertion: line 1076 pos 12: 'a == null || b == null || a.inherit == b.inherit': is not true. package:flutter/…/painting/text_style.dart:1076

This happens when using themeMode to switch between light and dark themes, trying to switch between different themes in theme attribute will work.

Sample Code (Using the counter app)

import 'package:flutter/material.dart';

late ValueNotifier<ThemeMode> preferedTheme;

void main() {
  String theme = 'system';
  preferedTheme = ValueNotifier(theme == "dark" ? ThemeMode.dark : ThemeMode.light);
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return ValueListenableBuilder<ThemeMode>(
      valueListenable: preferedTheme,
      builder: (_, themeMode, __) { 
        debugPrint("themeMode: $themeMode");
      return MaterialApp(
      title: 'Flutter Demo',
      themeMode: themeMode,
      theme: ThemeData(
        useMaterial3: true,
        textTheme: Theme.of(context).textTheme.copyWith(displayLarge: const TextStyle(fontSize: 76)
        ),
      ),
      darkTheme: ThemeData(
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
      },);
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});
  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {

    //Change theme mode
    preferedTheme.value = preferedTheme.value == ThemeMode.dark ? ThemeMode.light : ThemeMode.dark;

    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(

        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            const Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headline4,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ), 
    );
  }
}

Logs

                    ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY
╞═══════════════════════════════════════════════════════════
                    The following assertion was thrown building AnimatedTheme(duration: 200ms, dirty,
state:
                    _AnimatedThemeState#d8295(ticker active, ThemeDataTween(ThemeData#685d2 →
ThemeData#2c158))):
                    'package:flutter/src/painting/text_style.dart': Failed assertion: line 1076 pos 12:
'a == null || b
                    == null || a.inherit == b.inherit': is not true.

                    Either the assertion indicates an error in the framework itself, or we should provide
substantially
                    more information in this error message to help you determine and fix the underlying
cause.
                    In either case, please report this assertion by filing a bug on GitHub:
                      https://github.com/flutter/flutter/issues/new?template=2_bug.md

                    The relevant error-causing widget was:
                      MaterialApp
MaterialApp:file:///C:/Users/mmahg_000/playground/material3bug/lib/main.dart:21:14

                    When the exception was thrown, this was the stack:
                    #2      TextStyle.lerp (package:flutter/src/painting/text_style.dart:1076:12)
                    #3      TextTheme.lerp (package:flutter/src/material/text_theme.dart:617:32)
                    #4      ThemeData.lerp (package:flutter/src/material/theme_data.dart:1993:28)
                    #5      ThemeDataTween.lerp (package:flutter/src/material/theme.dart:185:41)
                    #6      Tween.transform (package:flutter/src/animation/tween.dart:329:12)
                    #7      Animatable.evaluate (package:flutter/src/animation/tween.dart:53:46)
                    #8      _AnimatedThemeState.build (package:flutter/src/material/theme.dart:240:20)
                    #9      StatefulElement.build (package:flutter/src/widgets/framework.dart:4975:27)
                    #10     ComponentElement.performRebuild
(package:flutter/src/widgets/framework.dart:4861:15)
                    #11     StatefulElement.performRebuild
(package:flutter/src/widgets/framework.dart:5033:11)
                    #12     Element.rebuild (package:flutter/src/widgets/framework.dart:4587:5)
                    #13     BuildOwner.buildScope (package:flutter/src/widgets/framework.dart:2667:19)
                    #14     WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:882:21)
                    #15     RendererBinding._handlePersistentFrameCallback
(package:flutter/src/rendering/binding.dart:378:5)
                    #16     SchedulerBinding._invokeFrameCallback
(package:flutter/src/scheduler/binding.dart:1172:15)
                    #17     SchedulerBinding.handleDrawFrame
(package:flutter/src/scheduler/binding.dart:1101:9)
                    #18     SchedulerBinding._handleDrawFrame
(package:flutter/src/scheduler/binding.dart:1012:5)
                    #19     _invoke (dart:ui/hooks.dart:148:13)
                    #20     PlatformDispatcher._drawFrame (dart:ui/platform_dispatcher.dart:318:5)
                    #21     _drawFrame (dart:ui/hooks.dart:115:31)
                    (elided 2 frames from class _AssertionError)


════════════════════════════════════════════════════════════════════════════════════════════════════

❯ flutter analyze
Analyzing material3bug...
No issues found! (ran in 8.0s)

flutter doctor -v
[✓] Flutter (Channel master, 3.1.0-0.0.pre.1105, on Microsoft Windows [Version 10.0.19043.1766], locale
    en-US)
    • Flutter version 3.1.0-0.0.pre.1105 at C:\Users\mmahg_000\flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 1006f9cf70 (3 weeks ago), 2022-06-04 16:43:05 -0400
    • Engine revision edc0f9d605
    • Dart version 2.18.0 (build 2.18.0-170.0.dev)
    • DevTools version 2.14.0

Checking Android licenses is taking an unexpectedly long time...[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
    • Android SDK at C:\Users\mmahg_000\Android\adt-bundle\sdk
    • Platform android-31, build-tools 30.0.3
    • ANDROID_HOME = C:\Users\mmahg_000\Android\adt-bundle\sdk
    • Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 11.0.12+7-b1504.28-7817840)
    • All Android licenses accepted.

[✓] Chrome - develop for the web
    • Chrome at C:\Program Files (x86)\Google\Chrome\Application\chrome.exe

[✓] Visual Studio - develop for Windows (Visual Studio Community 2022 17.0.4)
    • Visual Studio at C:\Program Files\Microsoft Visual Studio\2022\Community
    • Visual Studio Community 2022 version 17.0.32014.148
    • Windows 10 SDK version 10.0.19041.0

[✓] Android Studio (version 2021.2)
    • Android Studio at C:\Program Files\Android\Android Studio
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.12+7-b1504.28-7817840)

[✓] VS Code (version 1.68.1)
    • VS Code at C:\Users\mmahg_000\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.10.1

[✓] VS Code, 64-bit edition (version 1.63.2)
    • VS Code at C:\Program Files\Microsoft VS Code
    • Flutter extension version 3.10.1

[✓] Connected device (4 available)
    • ONEPLUS A5010 (mobile) • 74b5523b • android-arm64  • Android 10 (API 29)
    • Windows (desktop)      • windows  • windows-x64    • Microsoft Windows [Version 10.0.19043.1766]
    • Chrome (web)           • chrome   • web-javascript • Google Chrome 102.0.5005.115
    • Edge (web)             • edge     • web-javascript • Microsoft Edge 102.0.1245.33

[✓] HTTP Host Availability
    • All required HTTP hosts are available

• No issues found!

WhatsApp.Video.2022-06-25.at.11.02.19.PM.mp4

[xu-baolin]

Duplication of #103864

[rydmike]

@mmahgoub thanks for noticing this too, it is quite annoying, I wish there was a fix as well.

[mmahgoub]

@rydmike I opt to use similar textStyles for both dark and light modes

[rydmike]

Yes that avoids the issue. I don't know why the framework could for the conditions where it now throws an assert error since it cannot lerp animated between them, instead just swap between them without any animation. For the cases that this situation applies to, it would still be better than throwing an error and crashing.

@xu-baolin Any thoughts on when we might see a fix for this issue land? I know you made a fix proposal PR, but it was rejected for "reasons".

[github-actions]

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.