Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[web] HTMLAudioElement() produces "TypeError: Illegal constructor" #139125

Closed
2 tasks done
ryanheise opened this issue Nov 28, 2023 · 4 comments
Closed
2 tasks done

[web] HTMLAudioElement() produces "TypeError: Illegal constructor" #139125

ryanheise opened this issue Nov 28, 2023 · 4 comments
Labels
dependency: dart Dart team may need to help us found in release: 3.16 Found to occur in 3.16 found in release: 3.17 Found to occur in 3.17 has reproducible steps The issue has been confirmed reproducible and is ready to work on platform-web Web applications specifically r: invalid Issue is closed as not valid team-web Owned by Web platform team

Comments

@ryanheise
Copy link

ryanheise commented Nov 28, 2023 •
edited
Loading

Is there an existing issue for this?

Steps to reproduce

Run the code sample below.

Expected results

No error.

Actual results

I get the following error:

TypeError: Illegal constructor

Code sample

Code sample 
import 'package:web/helpers.dart';

void main() {
  AudioElement();
}

Screenshots or Video

No response

Logs

Logs 
flutter pub add web
flutter run -d chrome

Flutter Doctor output

Doctor output 
[✓] Flutter (Channel stable, 3.16.1, on macOS 13.6.1 22G313 darwin-x64, locale en-AU)
    • Flutter version 3.16.1 on channel stable at /Volumes/Samsung_T5/opt/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 7f20e5d18c (14 hours ago), 2023-11-27 09:47:30 -0800
    • Engine revision 22b600f240
    • Dart version 3.2.1
    • DevTools version 2.28.3

[✗] Android toolchain - develop for Android devices
    ✗ ANDROID_HOME = /Users/ryan/opt/android-sdk
      but Android SDK not found at this location.

[✓] Xcode - develop for iOS and macOS (Xcode 15.0.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 15A507
    • CocoaPods version 1.13.0

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[!] Android Studio (not installed)
    • Android Studio not found; download from https://developer.android.com/studio/index.html
      (or visit https://flutter.dev/docs/get-started/install/macos#android-setup for detailed instructions).

[✓] Connected device (3 available)
    • macOS (desktop)        • macos                                    • darwin-x64     • macOS 13.6.1 22G313 darwin-x64
    • Chrome (web)           • chrome                                   • web-javascript • Google Chrome 119.0.6045.159

[✓] Network resources
    • All expected network resources are available.

! Doctor found issues in 2 categories.
@ryanheise
Copy link
Author

This may or may not be relevant (I'm not sure how package:web does it under the hood):

https://stackoverflow.com/questions/71901055/uncaught-typeerror-illegal-constructor-when-extending-htmlspanelement

@danagbemava-nc danagbemava-nc added the in triage Presently being triaged by the triage team label Nov 28, 2023
@danagbemava-nc
Copy link
Member

Reproducible using the code sample provided above.

Labeling for further insight.

flutter doctor -v 
[✓] Flutter (Channel stable, 3.16.1, on macOS 14.1.1 23B81 darwin-arm64, locale en-GB)
    • Flutter version 3.16.1 on channel stable at /Users/nexus/dev/sdks/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 7f20e5d18c (19 hours ago), 2023-11-27 09:47:30 -0800
    • Engine revision 22b600f240
    • Dart version 3.2.1
    • DevTools version 2.28.3

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0-rc1)
    • Android SDK at /Users/nexus/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0-rc1
    • Java binary at: /Users/nexus/Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.0)
    • Xcode at /Applications/Xcode-15.0.0-Release.Candidate.app/Contents/Developer
    • Build 15A240d
    • CocoaPods version 1.13.0

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.3)
    • Android Studio at /Users/nexus/Applications/Android Studio.app/Contents
    • 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 17.0.6+0-17.0.6b829.9-10027231)

[✓] IntelliJ IDEA Ultimate Edition (version 2023.2.5)
    • IntelliJ at /Users/nexus/Applications/IntelliJ IDEA Ultimate.app
    • Flutter plugin version 76.3.4
    • Dart plugin version 232.10072.19

[✓] VS Code (version 1.84.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.76.0

[✓] Connected device (4 available)
    • Nexus (mobile)       • 00008020-001875E83A38002E • ios            • iOS 17.1.1 21B91
    • Dean’s iPad (mobile) • 00008103-000825C811E3401E • ios            • iOS 17.1.1 21B91
    • macOS (desktop)      • macos                     • darwin-arm64   • macOS 14.1.1 23B81 darwin-arm64
    • Chrome (web)         • chrome                    • web-javascript • Google Chrome 119.0.6045.159

[✓] Network resources
    • All expected network resources are available.

• No issues found!

[!] Flutter (Channel master, 3.17.0-16.0.pre.36, on macOS 14.1.1 23B81 darwin-arm64, locale en-GB)
    • Flutter version 3.17.0-16.0.pre.36 on channel master at /Users/nexus/dev/sdks/flutters
    ! Warning: `flutter` on your path resolves to /Users/nexus/dev/sdks/flutter/bin/flutter, which is not inside your current Flutter SDK checkout at /Users/nexus/dev/sdks/flutters. Consider adding /Users/nexus/dev/sdks/flutters/bin to the front of your path.
    ! Warning: `dart` on your path resolves to /Users/nexus/dev/sdks/flutter/bin/dart, which is not inside your current Flutter SDK checkout at /Users/nexus/dev/sdks/flutters. Consider adding /Users/nexus/dev/sdks/flutters/bin to the front of your path.
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision ad62645fce (8 hours ago), 2023-11-28 14:20:07 +0900
    • Engine revision 96137d05fa
    • Dart version 3.3.0 (build 3.3.0-169.0.dev)
    • DevTools version 2.30.0-dev.4
    • If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and upgrades.

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0-rc1)
    • Android SDK at /Users/nexus/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0-rc1
    • Java binary at: /Users/nexus/Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.0)
    • Xcode at /Applications/Xcode-15.0.0-Release.Candidate.app/Contents/Developer
    • Build 15A240d
    • CocoaPods version 1.13.0

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.3)
    • Android Studio at /Users/nexus/Applications/Android Studio.app/Contents
    • 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 17.0.6+0-17.0.6b829.9-10027231)

[✓] IntelliJ IDEA Ultimate Edition (version 2023.2.5)
    • IntelliJ at /Users/nexus/Applications/IntelliJ IDEA Ultimate.app
    • Flutter plugin version 76.3.4
    • Dart plugin version 232.10072.19

[✓] VS Code (version 1.84.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.76.0

[✓] Connected device (4 available)
    • Nexus (mobile)       • 00008020-001875E83A38002E • ios            • iOS 17.1.1 21B91
    • Dean’s iPad (mobile) • 00008103-000825C811E3401E • ios            • iOS 17.1.1 21B91
    • macOS (desktop)      • macos                     • darwin-arm64   • macOS 14.1.1 23B81 darwin-arm64
    • Chrome (web)         • chrome                    • web-javascript • Google Chrome 119.0.6045.159

[✓] Network resources
    • All expected network resources are available.

! Doctor found issues in 1 category.

@danagbemava-nc danagbemava-nc added platform-web Web applications specifically has reproducible steps The issue has been confirmed reproducible and is ready to work on team-web Owned by Web platform team found in release: 3.16 Found to occur in 3.16 found in release: 3.17 Found to occur in 3.17 and removed in triage Presently being triaged by the triage team labels Nov 28, 2023
@ryanheise ryanheise mentioned this issue Dec 4, 2023
Closed
@yjbanov yjbanov added the dependency: dart Dart team may need to help us label Dec 7, 2023
@srujzs
Copy link
Contributor

srujzs commented Dec 7, 2023 •
edited
Loading

This is a bug in package:web. I filed an issue here: dart-lang/web#124. The workaround is simple for now: document.createElement('audio').

There are no custom elements involved in package:web. It lowers the constructor to the intuitive lowering new HTMLAudioElement() in JS. That JS code returns that error, since the working way is to do new Audio() instead.

Marking it closed and tracking it in the package instead.

@srujzs srujzs closed this as completed Dec 7, 2023
@ryanheise ryanheise mentioned this issue Dec 8, 2023
Closed
@danagbemava-nc danagbemava-nc added the r: invalid Issue is closed as not valid label Dec 8, 2023
@github-actions GitHub Actions
Copy link

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.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Dec 22, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
dependency: dart Dart team may need to help us found in release: 3.16 Found to occur in 3.16 found in release: 3.17 Found to occur in 3.17 has reproducible steps The issue has been confirmed reproducible and is ready to work on platform-web Web applications specifically r: invalid Issue is closed as not valid team-web Owned by Web platform team
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@yjbanov @ryanheise @srujzs @danagbemava-nc