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

canvaskit.js:97 Uncaught SyntaxError: Unexpected token ')' (at canvaskit.js:97:504) while using local canvaskit #147491

Open
nimashahahmadian opened this issue Apr 28, 2024 · 3 comments
Open

canvaskit.js:97 Uncaught SyntaxError: Unexpected token ')' (at canvaskit.js:97:504) while using local canvaskit #147491

nimashahahmadian opened this issue Apr 28, 2024 · 3 comments
Labels
in triage Presently being triaged by the triage team waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds

Comments

@nimashahahmadian
Copy link

nimashahahmadian commented Apr 28, 2024 •
edited

Steps to reproduce

1-flutter create test --platforms=web
2- add following script to index.html

<script>
    window.flutterConfiguration = {
      canvasKitBaseUrl: "/canvaskit/"
    };
</script>

3- run build with the following code:
flutter build web --no-web-resources-cdn --web-renderer canvaskit
4- open the builded test app on the served route

Expected results

flutter web app download canvaskit.js from local server instead of somewhere like gstatic.com and run normally without the need of internet.

Actual results

(canvaskit.js:97 Uncaught SyntaxError: Unexpected token ')' (at canvaskit.js:97:504))
makes the onEntryPointLoaded to crash and not run the test application

Code sample

Code sample 
[flutter initial test app]

Logs

Logs 
[Uncaught SyntaxError: Unexpected token ')' (at canvaskit.js:97:504)
main.dart.js:5869 Rejecting promise with error: NoSuchMethodError: method not found: 'CanvasKitInit' (self.window.CanvasKitInit is not a function)
n @ main.dart.js:5869
$1 @ main.dart.js:19229
$1 @ main.dart.js:19608
So @ main.dart.js:25428
tW @ main.dart.js:25431
Pg @ main.dart.js:25056
$0 @ main.dart.js:25198
m5 @ main.dart.js:4206
du @ main.dart.js:25126
r3 @ main.dart.js:24856
N @ main.dart.js:4104
(anonymous) @ main.dart.js:17495
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
$2 @ main.dart.js:24862
Sn @ main.dart.js:25432
BQ @ main.dart.js:25435
Pg @ main.dart.js:25055
$0 @ main.dart.js:25198
m5 @ main.dart.js:4206
du @ main.dart.js:25126
r3 @ main.dart.js:24856
N @ main.dart.js:4104
(anonymous) @ main.dart.js:27732
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
$2 @ main.dart.js:24862
Sn @ main.dart.js:25432
BQ @ main.dart.js:25435
Pg @ main.dart.js:25055
$0 @ main.dart.js:25198
m5 @ main.dart.js:4206
du @ main.dart.js:25126
r3 @ main.dart.js:24856
N @ main.dart.js:4104
(anonymous) @ main.dart.js:737
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
$2 @ main.dart.js:24862
Sn @ main.dart.js:25432
BQ @ main.dart.js:25435
Pg @ main.dart.js:25055
$0 @ main.dart.js:25198
m5 @ main.dart.js:4206
du @ main.dart.js:25126
$2 @ main.dart.js:25031
Sn @ main.dart.js:25432
BQ @ main.dart.js:25435
Pg @ main.dart.js:25055
$0 @ main.dart.js:25198
m5 @ main.dart.js:4206
du @ main.dart.js:25126
r3 @ main.dart.js:24856
N @ main.dart.js:4104
(anonymous) @ main.dart.js:781
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
$2 @ main.dart.js:24862
Sn @ main.dart.js:25432
BQ @ main.dart.js:25435
Pg @ main.dart.js:25055
$0 @ main.dart.js:25198
m5 @ main.dart.js:4206
du @ main.dart.js:25126
r3 @ main.dart.js:24856
N @ main.dart.js:4104
(anonymous) @ main.dart.js:17878
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
$2 @ main.dart.js:24862
Sn @ main.dart.js:25432
BQ @ main.dart.js:25435
Pg @ main.dart.js:25055
$0 @ main.dart.js:25198
m5 @ main.dart.js:4206
Yi @ main.dart.js:4169
$0 @ main.dart.js:25156
acL @ main.dart.js:4238
acU @ main.dart.js:4240
$1 @ main.dart.js:24818
childList (async)
$1 @ main.dart.js:24825
a34 @ main.dart.js:4245
km @ main.dart.js:4302
Gu @ main.dart.js:25130
fU @ main.dart.js:25128
dF @ main.dart.js:25048
$1 @ main.dart.js:27249
Promise.then (async)
ix @ main.dart.js:5882
(anonymous) @ main.dart.js:19261
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
P @ main.dart.js:4099
j3 @ main.dart.js:19268
(anonymous) @ main.dart.js:17951
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
$1 @ main.dart.js:24859
So @ main.dart.js:25428
tW @ main.dart.js:25431
$0 @ main.dart.js:25188
m5 @ main.dart.js:4206
ka @ main.dart.js:25123
dF @ main.dart.js:24854
O @ main.dart.js:4103
(anonymous) @ main.dart.js:593
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
$1 @ main.dart.js:24859
So @ main.dart.js:25428
tW @ main.dart.js:25431
$0 @ main.dart.js:25188
m5 @ main.dart.js:4206
ka @ main.dart.js:25123
$0 @ main.dart.js:25159
acL @ main.dart.js:4238
acU @ main.dart.js:4240
$1 @ main.dart.js:24818
childList (async)
$1 @ main.dart.js:24825
a34 @ main.dart.js:4245
km @ main.dart.js:4302
Gu @ main.dart.js:25130
fU @ main.dart.js:25128
dF @ main.dart.js:25048
$1 @ main.dart.js:27249
Promise.then (async)
ix @ main.dart.js:5882
(anonymous) @ main.dart.js:577
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
P @ main.dart.js:4099
ae0 @ main.dart.js:595
mE @ main.dart.js:572
(anonymous) @ main.dart.js:17945
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
P @ main.dart.js:4099
HK @ main.dart.js:17974
iM @ main.dart.js:17939
(anonymous) @ main.dart.js:17887
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
P @ main.dart.js:4099
QV @ main.dart.js:17933
lq @ main.dart.js:17876
(anonymous) @ main.dart.js:794
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
$1 @ main.dart.js:24859
So @ main.dart.js:25428
tW @ main.dart.js:25431
$0 @ main.dart.js:25188
m5 @ main.dart.js:4206
ka @ main.dart.js:25123
dF @ main.dart.js:24854
O @ main.dart.js:4103
(anonymous) @ main.dart.js:733
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
$1 @ main.dart.js:24859
So @ main.dart.js:25428
tW @ main.dart.js:25431
$0 @ main.dart.js:25188
m5 @ main.dart.js:4206
ka @ main.dart.js:25123
dF @ main.dart.js:24854
O @ main.dart.js:4103
(anonymous) @ main.dart.js:19256
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
$1 @ main.dart.js:24859
So @ main.dart.js:25428
tW @ main.dart.js:25431
$0 @ main.dart.js:25188
m5 @ main.dart.js:4206
ka @ main.dart.js:25123
$0 @ main.dart.js:25159
acL @ main.dart.js:4238
acU @ main.dart.js:4240
$1 @ main.dart.js:24818
childList (async)
$1 @ main.dart.js:24825
a34 @ main.dart.js:4245
km @ main.dart.js:4302
Gu @ main.dart.js:25130
fU @ main.dart.js:25128
dF @ main.dart.js:25048
$1 @ main.dart.js:27249
Promise.then (async)
ix @ main.dart.js:5882
(anonymous) @ main.dart.js:19250
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
$1 @ main.dart.js:24859
So @ main.dart.js:25428
tW @ main.dart.js:25431
$0 @ main.dart.js:25188
m5 @ main.dart.js:4206
ka @ main.dart.js:25123
$0 @ main.dart.js:25159
acL @ main.dart.js:4238
acU @ main.dart.js:4240
$1 @ main.dart.js:24818
childList (async)
$1 @ main.dart.js:24825
a34 @ main.dart.js:4245
km @ main.dart.js:4302
Gu @ main.dart.js:25130
fU @ main.dart.js:25128
dF @ main.dart.js:25048
$1 @ main.dart.js:27249
Promise.then (async)
ix @ main.dart.js:5882
(anonymous) @ main.dart.js:19250
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
P @ main.dart.js:4099
om @ main.dart.js:19257
(anonymous) @ main.dart.js:725
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
$1 @ main.dart.js:24859
So @ main.dart.js:25428
tW @ main.dart.js:25431
$0 @ main.dart.js:25188
m5 @ main.dart.js:4206
ka @ main.dart.js:25123
dF @ main.dart.js:24854
O @ main.dart.js:4103
(anonymous) @ main.dart.js:593
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
$1 @ main.dart.js:24859
So @ main.dart.js:25428
tW @ main.dart.js:25431
$0 @ main.dart.js:25188
m5 @ main.dart.js:4206
ka @ main.dart.js:25123
$0 @ main.dart.js:25159
acL @ main.dart.js:4238
acU @ main.dart.js:4240
$1 @ main.dart.js:24818
childList (async)
$1 @ main.dart.js:24825
a34 @ main.dart.js:4245
km @ main.dart.js:4302
Gu @ main.dart.js:25130
fU @ main.dart.js:25128
dF @ main.dart.js:25048
$1 @ main.dart.js:27249
Promise.then (async)
ix @ main.dart.js:5882
(anonymous) @ main.dart.js:577
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
P @ main.dart.js:4099
ae0 @ main.dart.js:595
mE @ main.dart.js:572
(anonymous) @ main.dart.js:716
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
P @ main.dart.js:4099
adH @ main.dart.js:734
FG @ main.dart.js:710
(anonymous) @ main.dart.js:792
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
P @ main.dart.js:4099
Fz @ main.dart.js:796
(anonymous) @ main.dart.js:752
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
P @ main.dart.js:4099
ae6 @ main.dart.js:755
W7 @ main.dart.js:735
(anonymous) @ main.dart.js:27734
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
P @ main.dart.js:4099
Cg @ main.dart.js:27736
$1 @ main.dart.js:27726
(anonymous) @ main.dart.js:17498
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
P @ main.dart.js:4099
Cd @ main.dart.js:17503
$1 @ main.dart.js:17492
$1 @ main.dart.js:19585
a9e @ main.dart.js:2778
abY @ main.dart.js:5861
(anonymous) @ main.dart.js:5857
onEntrypointLoaded @ testweb/:61
didCreateEngineInitializer @ flutter.js:3
(anonymous) @ main.dart.js:6193
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
P @ main.dart.js:4099
VL @ main.dart.js:6195
(anonymous) @ main.dart.js:17068
(anonymous) @ main.dart.js:4113
$2 @ main.dart.js:24865
P @ main.dart.js:4099
Wf @ main.dart.js:17070
(anonymous) @ main.dart.js:51780
(anonymous) @ main.dart.js:51776
dartProgram @ main.dart.js:51778
(anonymous) @ main.dart.js:51780
testweb/:1 Uncaught (in promise) null]

Flutter Doctor output

Doctor output 
[flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.19.6, on Microsoft Windows [Version 10.0.19044.4046], locale en-US)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[!] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    X cmdline-tools component is missing
      Run `path/to/sdkmanager --install "cmdline-tools;latest"`
      See https://developer.android.com/studio/command-line for more details.
    X Android license status unknown.
      Run `flutter doctor --android-licenses` to accept the SDK licenses.
      See https://flutter.dev/docs/get-started/install/windows#android-setup for more details.
[√] Chrome - develop for the web
[!] Visual Studio - develop Windows apps (Visual Studio Build Tools 2019 16.11.34)
    X The current Visual Studio installation is incomplete.
      Please use Visual Studio Installer to complete the installation or reinstall Visual Studio.
[√] Android Studio (version 2023.1)
[√] VS Code (version 1.88.1)
[√] Connected device (4 available)
[!] Network resources
    X A network error occurred while checking "https://maven.google.com/": The semaphore timeout period has expired.


! Doctor found issues in 3 categories.]
@huycozy huycozy added the in triage Presently being triaged by the triage team label Apr 29, 2024
@huycozy
Copy link
Member

huycozy commented Apr 29, 2024

Hi @nimashahahmadian
I can't reproduce the issue on my end. The built web can run normally without error above. Could you share your sample code so I can try it? And which browser are you using?

@huycozy huycozy added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label Apr 29, 2024
@nimashahahmadian
Copy link
Author

My sample code is flutter's original start project.
the way to reproduce it is using build with the following commands:

flutter build web --no-web-resources-cdn --web-renderer canvaskit

I tried serving the build with local npm serve method and with apache on a remote server.
when serving local with npm serve. some errors happen which I can not understand what it is but the app works through to my login page.

on remote server app won't even start.
and crash with mentioned logs and errors.

what is the best practice to serve flutter web app using canvaskit build and not using any cdn?

@github-actions github-actions bot removed the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 6, 2024
@huycozy
Copy link
Member

huycozy commented May 7, 2024

I hosted the build in local with Python, it works as expected:

Screenshot 2024-05-07 at 11 55 38

when serving local with npm serve. some errors happen which I can not understand what it is but the app works through to my login page.

It seems you are testing your production project. Please retry on a new Flutter project.

Could you try switching to Network tab on your browser and check the request URLs as in my screenshot?

@huycozy huycozy added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 7, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
in triage Presently being triaged by the triage team waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@nimashahahmadian @huycozy