Is there a playground for websocket routes?

[Pet3ris]

Hi There,

I'm using the following code to run a websocket GraphQL endpoint:

"""Main server application."""

import asyncio

import graphene

from starlette.applications import Starlette
from starlette_graphene3 import GraphQLApp
from starlette.middleware import Middleware
from starlette.middleware.cors import CORSMiddleware

from .schema import schema_basic

middleware = [
    Middleware(
        CORSMiddleware,
        allow_origins=['*'],
        allow_methods=['POST', 'GET'],
        allow_headers=['access-control-allow-origin', 'authorization', 'content-type']
    )
]

app = Starlette(debug=True, middleware=middleware)
gapp = GraphQLApp(schema_basic(), playground=True)
app.add_route("/graphql", gapp)
app.add_websocket_route("/graphql-ws", gapp)

How do I now debug the new websocket route in the playground?

1.

Opening up playground with localhost:5000/graphql-ws doesn't work

2.

Opening up playground with localhost:5000/graphql works but then when running the subcription, it's attempting to connect to the server on the incorrect route (/graphql).

Any thoughts on how to figure out if the websocket endpoint is working?

[ciscorn]

Hi @Pet3ris,

Which ASGI server are you using?

If you are using Uvicorn, you need to install the websockets or uvicorn[standard] package.

pip3 install websockets

[Pet3ris]

@ciscorn yeah I'm using uvicorn[standard]:

uvicorn = {extras = ["standard"], version = "^0.13.4"}
starlette = "^0.14.2"
starlette-graphene3 = "^0.3.0"

I'm launching the server with:

uvicorn --reload --port 5000 src:app

[ciscorn]

@Pet3ris

I've added playground_options parameter to starlette-graphene3==0.3.2, which allows you to do something like this:

GraphQLApp(schema, playground=True, playground_options={"subscriptionEndpoint": "/graphql-ws"})

[Pet3ris]

Wow that immediately works:

Appreciate the blitz release!