Repository: flutter
Issue: Rendering issues on IOS (Flutter Web)
Labels: e: device-specific,platform-ios,platform-web,c: rendering,P2,team-web,triaged-web

## Steps to Reproduce

<!-- Please include full steps to reproduce so that we can reproduce the problem. -->

These issues were not seen on newer iphones but a specific user action maybe trigerring them so I am not 100% sure.

Open [This link](https://wen-el-sahra.web.app/destination/Romantic%20Dinner/AcbWNfgu8acwFpHIGY8n), try to choose a date. The calendar picker will not render properly and the date will not be shown when selected beside select date. Refer to the android screenshot below for expected result.

Tested on IOS 12.5.1
Iphone 6

**Expected results:** <!-- what did you want to see? -->
1. Date field and date picker should display correctly.

**Actual results:** <!-- what did you see? -->
1. Date field and date picker not displaying correctly.
 
<details>
<summary>Code sample</summary>

<!--
      Please create a minimal reproducible sample that shows the problem
      and attach it below between the lines with the backticks.

      To create it you can use `flutter create bug` command and update the `main.dart` file.

      Alternatively, you can use https://dartpad.dev/
      which is capable of creating and running small Flutter apps.

      Without this we will unlikely be able to progress on the issue, and because of that
      we regretfully will have to close it.
-->

```
datePicker function

Future _selectEventDate(BuildContext context) async {
    var newPicked = await showDatePicker(
      context: context,
      firstDate: DateTime.now(),
      lastDate: DateTime(2100),
      initialDate: getInitialDate(false),
      builder: (context, child) => Theme(
          data: ThemeData.light().copyWith(
            primaryColor: THEME_COLOR_RED,
            secondaryHeaderColor: THEME_COLOR,
            colorScheme: ColorScheme.light(primary: Colors.black),
            buttonTheme: ButtonThemeData(textTheme: ButtonTextTheme.primary),
          ),
          child: child),
      selectableDayPredicate: (DateTime val) {
        String sanitized =
            '${val.day.toString().padLeft(2, '0')}/${val.month.toString().padLeft(2, '0')}/';

        if (!daysOfWeekEnabled[val.weekday - 1]) {
          return false;
        }

        return !disabledDates.contains(sanitized);
      },
    );
    if (newPicked != null) {
      picked = newPicked;
      setState(() {
        _eventDate =
            '${picked.day.toString().padLeft(2, '0')}/${picked.month.toString().padLeft(2, '0')}/${picked.year}';
      });
    }
  }

```

</details>

<details>
  <summary>Logs</summary>

<!--
      Run your application with `flutter run --verbose` and attach all the
      log output below between the lines with the backticks. If there is an
      exception, please see if the error message includes enough information
      to explain how to solve the issue.
-->

```
```

<!--
     Run `flutter analyze` and attach any output of that command below.
     If there are any analysis errors, try resolving them before filing this issue.
-->

```
```

<!-- Finally, paste the output of running `flutter doctor -v` here. -->

```
[√] Flutter (Channel beta, 2.6.0-5.2.pre, on Microsoft Windows [Version 10.0.19043.1288], locale en-IN)
    • Flutter version 2.6.0-5.2.pre at D:\flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 400608f101 (5 weeks ago), 2021-09-15 15:50:26 -0700
    • Engine revision 1d521d89d8
    • Dart version 2.15.0 (build 2.15.0-82.2.beta)

[√] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
    • Android SDK at C:\Users\shata\AppData\Local\Android\Sdk
    • Platform android-30, build-tools 30.0.3
    • ANDROID_SDK_ROOT = C:\Users\shata\AppData\Local\Android\Sdk
    • Java binary at: D:\Android\Android Studio\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7249189)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe

[√] Visual Studio - develop for Windows (Visual Studio Community 2019 16.11.2)
    • Visual Studio at C:\Program Files (x86)\Microsoft Visual Studio\2019\Community
    • Visual Studio Community 2019 version 16.11.31624.102
    • Windows 10 SDK version 10.0.19041.0

[√] Android Studio (version 2020.3)
    • Android Studio at D:\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.10+0-b96-7249189)

[√] IntelliJ IDEA Ultimate Edition (version 2020.3)
    • IntelliJ at D:\IntelliJ IDEA 2020.3.1
    • Flutter plugin version 54.0.3
    • Dart plugin version 203.7759

[√] Connected device (3 available)
    • Windows (desktop) • windows • windows-x64    • Microsoft Windows [Version 10.0.19043.1288]
    • Chrome (web)      • chrome  • web-javascript • Google Chrome 94.0.4606.81
    • Edge (web)        • edge    • web-javascript • Microsoft Edge 94.0.992.38

• No issues found!
```

</details>

Date and calendar render issue on IOS

https://user-images.githubusercontent.com/67138059/137778369-f91e4034-4b43-4c55-a2b1-5e5dad61df5c.mp4

Android rendering date field correctly

![Android rendering date field correctly](https://user-images.githubusercontent.com/67138059/137777597-09ff30ba-1c9e-4231-8e68-c01b2c582d53.jpeg)