TextOverflow in Flutter not helping avoid overflow, how to constrain text length?

Question

I have been struggling with this for a while and also in the past, I have tried many combinations of adding constraints including variations of Row, Column, Expanded, Flexible, ConstrainedBox, LayoutBuilder etc and nothing seems to fix the basic issue of Text and TextOverflow not actually helping confining to overflow boundaries. It seems that if the framework knows it's overflowing there must be a way to constrain to that point, but I have not found it. Any suggestions including packages would be welcome otherwise I'm considering making a PR for the framework. Here is a minimal sample that displays my trouble.

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});
  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child:
        Container(
        color: Colors.red,
          width: MediaQuery.of(context).size.width,
          child:Row(children: [
          Row(children: [
            Text("A VERY LONG TEXT  ASDFASDFASDFASDFASDFASDFASDFASDASDFASDFASDFASDFASDFASDFASDFASDF",
            style: TextStyle(overflow: TextOverflow.clip),
            )
          ],),

          Row(children: [
            Container(
              color: Colors.green,
              width: MediaQuery.of(context).size.width * .25,
            ),
            Container(
              color: Colors.blue,
              width: MediaQuery.of(context).size.width * .25,
            )
          ],)

        ]),)
      ),
    );
  }
}

Answer 1

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});
  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
          child: Container(
        color: Colors.red,
        width: MediaQuery.of(context).size.width,
        child: Row(children: [
          Expanded(
            child: Text(
              "A VERY LONG TEXT  ASDFASDFASDFASDFASDFASDFASDFASDASDFASDFASDFASDFASDFASDFASDFASDF",
              style: TextStyle(overflow: TextOverflow.clip),
            ),
          ),
          Row(
            children: [
              Container(
                color: Colors.green,
                width: MediaQuery.of(context).size.width * .25,
              ),
              Container(
                color: Colors.blue,
                width: MediaQuery.of(context).size.width * .25,
              )
            ],
          )
        ]),
      )),
    );
  }
}

This should work