Bug Report: Vtadmin page does not show any data on first install in version 19

[bantyK]

Overview of the Issue

Upon following all the steps mention in Local install via source in mac, after running the script ./101_initial_cluster.sh script the command output in the terminal shows all steps being run successfully but the vtadmin UI portal shows no data. Keyspace, cluster, schema etc all show "No result".

The script output is shown below

Starting etcd...
add zone1 CellInfo
Created cell: zone1
etcd is running!
Starting vtctld...
vtctld is running!
Successfully created keyspace commerce. Result:
{
"name": "commerce",
"keyspace": {
"keyspace_type": "NORMAL",
"base_keyspace": "",
"snapshot_time": null,
"durability_policy": "semi_sync",
"throttler_config": null,
"sidecar_db_name": "_vt"
}
}
Starting MySQL for tablet zone1-0000000102...
Starting MySQL for tablet zone1-0000000101...
Starting MySQL for tablet zone1-0000000100...
Waiting for mysqlctls to start...
MySQL for tablet zone1-0000000102 is running!
MySQL for tablet zone1-0000000100 is running!
MySQL for tablet zone1-0000000101 is running!
mysqlctls are running!
Starting vttablet for zone1-0000000100...
HTTP/1.1 200 OK
Date: Thu, 02 May 2024 06:38:17 GMT
Content-Type: text/html; charset=utf-8

vttablet for zone1-0000000100 is running!
Starting vttablet for zone1-0000000101...
HTTP/1.1 200 OK
Date: Thu, 02 May 2024 06:38:17 GMT
Content-Type: text/html; charset=utf-8

vttablet for zone1-0000000101 is running!
Starting vttablet for zone1-0000000102...
HTTP/1.1 200 OK
Date: Thu, 02 May 2024 06:38:17 GMT
Content-Type: text/html; charset=utf-8

vttablet for zone1-0000000102 is running!
Starting vtorc...
vtorc is running!

• UI: http://localhost:16000/
• Logs: /Users/bantyk/vitess/examples/local/vtdataroot/tmp/vtorc.out
• PID: 86225

New VSchema object:
{
"sharded": false,
"vindexes": {},
"tables": {
"corder": {
"type": "",
"column_vindexes": [],
"auto_increment": null,
"columns": [],
"pinned": "",
"column_list_authoritative": false,
"source": ""
},
"customer": {
"type": "",
"column_vindexes": [],
"auto_increment": null,
"columns": [],
"pinned": "",
"column_list_authoritative": false,
"source": ""
},
"product": {
"type": "",
"column_vindexes": [],
"auto_increment": null,
"columns": [],
"pinned": "",
"column_list_authoritative": false,
"source": ""
}
},
"require_explicit_routing": false,
"foreign_key_mode": "unspecified",
"multi_tenant_spec": null
}
If this is not what you expected, check the input data (as JSON parsing will skip unexpected fields).
Starting vtgate...
vtgate is up!
Access vtgate at http://bantyk-p32n2qyh2c:15001/debug/status
vtadmin-api http-origin set to "http://bantyk-p32n2qyh2c:14201/"
vtadmin-api is running!

• API: http://bantyk-p32n2qyh2c:14200/
• Logs: /Users/bantyk/vitess/examples/local/vtdataroot/tmp/vtadmin-api.out
• PID: 86311

Building vtadmin-web...
../common/scripts/../../../web/vtadmin/../../build.env: line 17: ./tools/shell_functions.inc: No such file or directory
../common/scripts/../../../web/vtadmin/../../build.env: line 20: goversion_min: command not found
Go version reported: go version go1.22.2 darwin/arm64. Version 1.22.2+ recommended. See https://vitess.io/contributing/build-from-source for install instructions.

Installing nvm...

nvm is already installed!

Configuring Node.js 20.12.2

v20.12.2 is already installed.
Now using node v20.12.2 (npm v10.5.0)

Setting VITE_VTADMIN_API_ADDRESS to "http://bantyk-p32n2qyh2c:14200/"

[email protected] build
vite build

vite v4.5.3 building for production...
transforming (1) index.html=============

WARNING: You are currently running a version of TypeScript which is not officially supported by @typescript-eslint/typescript-estree.

You may find that it works just fine, or you may not.

SUPPORTED TYPESCRIPT VERSIONS: >=3.3.1 <5.2.0

YOUR TYPESCRIPT VERSION: 5.4.5

Please only submit bug reports when using the officially supported version.

=============
node_modules/@protobufjs/inquire/index.js (12:18) Use of eval in "node_modules/@protobufjs/inquire/index.js" is strongly discouraged as it poses security risks and may cause issues with minification.
✓ 1238 modules transformed.
build/assets/chevronUp-3d6782a5.svg 0.18 kB │ gzip: 0.16 kB
build/assets/chevronDown-02f94e73.svg 0.19 kB │ gzip: 0.16 kB
build/assets/download-8ef290b4.svg 0.21 kB │ gzip: 0.18 kB
build/assets/delete-a9184ef9.svg 0.23 kB │ gzip: 0.18 kB
build/assets/info-2617ee9d.svg 0.34 kB │ gzip: 0.23 kB
build/assets/circleAdd-cfd7e5db.svg 0.35 kB │ gzip: 0.23 kB
build/assets/alertFail-8056b6e4.svg 0.35 kB │ gzip: 0.23 kB
build/assets/checkSuccess-f8fd1dbb.svg 0.36 kB │ gzip: 0.23 kB
build/assets/search-3261bac7.svg 0.41 kB │ gzip: 0.26 kB
build/assets/question-a67b2492.svg 0.46 kB │ gzip: 0.28 kB
build/assets/runQuery-edfab4ed.svg 0.49 kB │ gzip: 0.28 kB
build/assets/open-405dd348.svg 0.49 kB │ gzip: 0.33 kB
build/index.html 0.90 kB │ gzip: 0.48 kB
build/assets/bug-5b6edb54.svg 0.99 kB │ gzip: 0.54 kB
build/assets/topology-0032b65e.svg 1.62 kB │ gzip: 0.83 kB
build/assets/NotoMono-Regular-41fd7ccc.ttf 107.85 kB
build/assets/NotoSans-Regular-c8cff31f.ttf 313.14 kB
build/assets/NotoSans-SemiBold-43207822.ttf 313.72 kB
build/assets/NotoSans-Bold-c6a598dd.ttf 313.79 kB
build/assets/index-10400842.css 73.63 kB │ gzip: 14.48 kB
build/assets/index-2179745c.js 3,333.76 kB │ gzip: 546.88 kB

(!) Some chunks are larger than 500 kBs after minification. Consider:

• Using dynamic import() to code-split the application
• Use build.rollupOptions.output.manualChunks to improve chunking: https://rollupjs.org/configuration-options/#output-manualchunks
• Adjust chunk size limit for this warning via build.chunkSizeWarningLimit.
  ✓ built in 7.11s
  vtadmin-web is running!
  • Browser: http://bantyk-p32n2qyh2c:14201/
  • Logs: /Users/bantyk/vitess/examples/local/vtdataroot/tmp/vtadmin-web.out
  • PID: 86912`

Underlying database is created as shown in the screenshot below.

Vtadmin shows no data

Create keyspace page also shows error

Further more the last step in the document asks to run the command source ../common/env.sh does not work in mac and fails with the error ../common/env.sh:83: command not found: shopt

Reproduction Steps

Go to this link: https://vitess.io/docs/19.0/get-started/local-mac/
Do a clean installation.
Run the last 101_initial_cluster.sh
Open the vtadmin portal via http://:14200/api/clusters (this is the URL given by the 101_initial_cluster.sh script
Observe the count of keyspaces, Gates, Clusters etc. They will all be 0

Binary Version

vtgate version Version: 20.0.0-SNAPSHOT (Git revision 1fd6d904ed1994a91f0901704f15123a292ef205 branch 'main') built on Thu May  2 12:05:40 IST 2024 by bantyk@bantyk-P32N2QYH2C using go1.22.2 darwin/arm64

Operating System and Environment details

Operating system: MacOS Sonoma 14.4
Kernel: Darwin 23.4.0
Arch: arm64

Log Fragments

No response

[frouioui]

To add to this issue, when reproducing the steps in the consol we can see that API requests are blocked by CORS as seen in the log below (visible in the web consol). This issue happens even though we use the URL printed by the 101 script and also when going on localhost. The --http-origin flag on the vtadmin-api side seems to be set correctly according to the log, however in the request header when calling the API the field Origin is set to localhost (instead of http://Florents-MacBook-Pro-2.local in my case).

Access to fetch at 'http://florents-macbook-pro-2.local:14200/api/vtctlds' from origin 'http://florents-macbook-pro-2.local:14201' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

[notfelineit]

Thanks @frouioui ! Would you mind sharing where you see the Origin being set, and the network request if you have it available? 🙏

[notfelineit]

Ok, I was able to recreate on my new m2 laptop 😄 Might have something to do with capitalization:

snippet from my startup script:

vtadmin-api expects vtadmin-web at, and set http-origin to "http://Francess-MacBook-Pro.local:14201"
vtadmin-api is running!
  - API: http://Francess-MacBook-Pro.local:14200
  - Logs: /Users/francesthai/planetscale/vitess/examples/local/vtdataroot/tmp/vtadmin-api.out
  - PID: 13404

Building vtadmin-web...
~/planetscale/vitess ~/planetscale/vitess/examples/local
~/planetscale/vitess/examples/local

Installing nvm...

nvm is already installed!

Configuring Node.js 20.12.2

v20.12.2 is already installed.
Now using node v20.12.2 (npm v10.7.0)

Setting VITE_VTADMIN_API_ADDRESS to "http://Francess-MacBook-Pro.local:14200"

[notfelineit]

Good news is that after normalizing the hostnames in the start up scripts, this works fine now:

from #15839

[notfelineit]

This should be fixed now that #15839 is merged. It's backported to 19 and 18 as well. Please let us know if you run into anymore issues @bantyK

[bantyK]

I am sorry folks, but still the same issue. I took the latest pull on main for version 19 and ran the 101_initial_cluster script.

[notfelineit]

@bantyK can you share your output from running ./101_initial_cluster.sh as well as the request body of one of those CORS errors in your network tab?

[bantyK]

hi @notfelineit I had to do a fresh install and now its working. Thank you for fixing this. :)

[notfelineit]

@bantyK yay that's great! 🥳