Unable to access https://localhost:3000 from inside docker container using docker-compose but can access via DNS name on a mac - docker

Question

Using the docker-compose file below.
version: "2.4"
services:
test-database:
image: mcr.microsoft.com/mssql/server
build: ms-sql-db
environment:
ACCEPT_EULA: Y
SA_PASSWORD: removed
MSSQL_PID: removed
tty: true
ports:
- 31433:1433
volumes:
- database-data:/var/opt/mssql
healthcheck:
test: nc -z localhost 1433 || exit -1
interval: 10s
timeout: 5s
retries: 5
start_period: 40s
api:
image: removed/api:1.0
build:
context: .
dockerfile: Api/Dockerfile-dev
depends_on:
test-database:
condition: service_healthy
volumes:
- ./Api:/app
ports:
- 5000:5000
- 5001:5001
tty: true
healthcheck:
test: curl --fail --insecure https://localhost:5001/api/health
interval: 5s
timeout: 5s
retries: 3
start_period: 40s
ui:
build:
context: .
dockerfile: webapp/Dockerfile-dev
depends_on:
api:
condition: service_healthy
volumes:
- ./webapp:/app
- /app/node_modules
ports:
- 3000:3000
environment:
- NODE_ENV=development
healthcheck:
test: curl --fail --insecure https://localhost:3000/
interval: 5s
timeout: 5s
retries: 3
start_period: 40s
the container fails to star due to the health check.
test: curl --fail --insecure https://localhost:3000/
However, if I use the dns name for the container created by docker-compose as shown below it works.
test: curl --fail --insecure https://ui:3000/
I'm using a Mac and Docker Desktop.
Edit
Adding specific issue for clarity. My issue is that in container I can only access https://ui:3000/ and I can't access https://localhost:3000/ and I'd rather not couple the health check to the service name.