GraphiQL interface doesn't load

[neuro42]

NetBox version

3.5.2

Python version

3.9

Steps to Reproduce

1. Click on the GraphQL API link at the bottom of the page

Expected Behavior

GraphiQL interface to open in a new tab

Observed Behavior

Blank tab opens with:
Uncaught TypeError: graphqlWs is undefined
https://netbox/static/graphene_django/graphiql.js:76
https://netbox/static/graphene_django/graphiql.js:121

[arthanson]

@jeremystretch were you able to reproduce this? I tried on local copy, rebuilt frontend, still works fine.

[stavr666]

Works in my 3.5.1

Not works in Demo

[stuntguy3000]

Can you guys provide more information about your installations - I can't replicate either.

Are they brand new? Have you done migrations? How about Collecting Static Files?

[GCHQDeveloper926]

@stuntguy3000 This is happening for me on the live demo API - https://demo.netbox.dev/graphql/

[neuro42]

This is not a new installation; it's been upgraded since the 2.x days. The venv gets rebuilt for each release, making use of the upgrade.sh script. Here's a pip list of what's installed in the venv:

Package                       Version
----------------------------- --------
aiodns                        3.0.0
aniso8601                     9.0.1
asgiref                       3.7.0
async-timeout                 4.0.2
attrs                         23.1.0
bcrypt                        4.0.1
bleach                        6.0.0
boto3                         1.26.138
botocore                      1.29.138
certifi                       2023.5.7
cffi                          1.15.1
charset-normalizer            3.1.0
click                         8.1.3
colorama                      0.4.6
cryptography                  40.0.2
decorator                     5.1.1
defusedxml                    0.7.1
Django                        4.1.9
django-auth-ldap              4.3.0
django-cors-headers           4.0.0
django-debug-toolbar          4.1.0
django-filter                 23.2
django-graphiql-debug-toolbar 0.2.0
django-gssapi                 1.0
django-js-asset               2.0.0
django-mptt                   0.14.0
django-pglocks                1.0.4
django-prometheus             2.3.1
django-redis                  5.2.0
django-rich                   1.5.0
django-rq                     2.8.1
django-tables2                2.5.3
django-taggit                 4.0.0
django-timezone-field         5.0
djangorestframework           3.14.0
drf-spectacular               0.26.2
drf-spectacular-sidecar       2023.5.1
dulwich                       0.21.5
ecdsa                         0.18.0
feedparser                    6.0.10
future                        0.18.3
ghp-import                    2.1.0
graphene                      3.2.2
graphene-django               3.0.2
graphql-core                  3.2.3
graphql-relay                 3.2.0
gssapi                        1.8.2
gunicorn                      20.1.0
idna                          3.4
importlib-metadata            6.6.0
inflection                    0.5.1
Jinja2                        3.1.2
jmespath                      1.0.1
jsonschema                    4.17.3
junos-eznc                    2.6.7
lxml                          4.9.2
Markdown                      3.3.7
markdown-it-py                2.2.0
MarkupSafe                    2.1.2
mdurl                         0.1.2
mergedeep                     1.3.4
mkdocs                        1.4.3
mkdocs-autorefs               0.4.1
mkdocs-material               9.1.14
mkdocs-material-extensions    1.1.1
mkdocstrings                  0.21.2
mkdocstrings-python-legacy    0.2.3
napalm                        4.1.0
napalm-procurve               0.6.0
ncclient                      0.6.13
netaddr                       0.8.0
netbox-plugin-prometheus-sd   0.6.0rc1
netmiko                       4.2.0
netutils                      1.4.1
ntc-templates                 3.3.0
oauthlib                      3.2.2
packaging                     23.1
paramiko                      3.1.0
Pillow                        9.5.0
pip                           23.1.2
pkg-resources                 0.0.0
prometheus-client             0.16.0
promise                       2.3
psycopg2-binary               2.9.6
pyasn1                        0.5.0
pyasn1-modules                0.3.0
pycares                       4.3.0
pycparser                     2.21
pyeapi                        0.8.4
Pygments                      2.15.1
PyJWT                         2.7.0
pymdown-extensions            10.0.1
pymssql                       2.2.7
PyMySQL                       0.9.3
PyNaCl                        1.5.0
pynetbox                      7.0.1
pyparsing                     3.0.9
pyrsistent                    0.19.3
pyserial                      3.5
python-dateutil               2.8.2
python-jose                   3.3.0
python-ldap                   3.4.3
python-slugify                8.0.1
python3-openid                3.2.0
pytkdocs                      0.16.1
pytz                          2023.3
pyvmomi                       8.0.1.0
PyYAML                        6.0
pyyaml-env-tag                0.1
redis                         4.5.5
regex                         2023.5.5
requests                      2.31.0
requests-oauthlib             1.3.1
rich                          13.3.5
rq                            1.14.1
rsa                           4.9
s3transfer                    0.6.1
scp                           0.14.5
sentry-sdk                    1.23.1
setuptools                    44.1.1
sgmllib3k                     1.0.0
six                           1.16.0
social-auth-app-django        5.2.0
social-auth-core              4.4.2
sqlparse                      0.4.4
svgwrite                      1.4.3
tablib                        3.4.0
text-unidecode                1.3
textfsm                       1.1.3
transitions                   0.9.0
ttp                           0.9.4
ttp-templates                 0.3.5
typing-extensions             4.6.0
tzdata                        2023.3
uritemplate                   4.1.1
urllib3                       1.26.16
watchdog                      3.0.0
webencodings                  0.5.1
wheel                         0.40.0
yamlordereddictloader         0.4.0
zipp                          3.15.0

[GCHQDeveloper926]

I'm currently looking at this as I wanted to fix something else with the GQL API - would be up for collaborating with someone to fix this current bug so I can open a PR and go through that process! Thanks.

[kkthxbye-code]

The following release broke it: https://github.com/graphql-python/graphene-django/releases/tag/v3.0.1

pip install --upgrade graphene-django==3.0.0 fixes it for me.

Probably specifically this commit: graphql-python/graphene-django@3283d0b#diff-a093738eb6c0d9559764bad4c87062d3087839acb88435bfbee607c610208d40L69

Our graphiql is an older version here: https://github.com/netbox-community/netbox/blob/develop/netbox/project-static/netbox-graphiql/package.json#L9

We would probably need to upgrade to fix it. The immediate workaroudn would be to pin graphene-django to 3.0.0.

[jeremystretch]

We could work on upgrading the necessary dependencies, but given that we're planning to replace graphene-django with Strawberry in the near future (see #9856), I'm okay with just pinning it to v3.0.0 for now.