Gatsby + Auth0 дает SyntaxError: не удалось выполнить querySelector в документе

Question

Я следую этому руководству по внедрению auth0 в приложение Gatsby: https://auth0.com/blog/securing-gatsby-with-auth0/

Однако на экране обратного вызова я получаю следующую ошибку:

SyntaxError: Failed to execute 'querySelector' on 'Document': '#access_token=...

поступает из

ScrollHandler._this.scrollToHash
src/app/www/frontend/node_modules/gatsby-react-router-scroll/scroll-handler.js:52
  49 | };
  50 | 
  51 | _this.scrollToHash = function (hash, prevProps) {
> 52 |   var node = document.querySelector(hash);
  53 | 
  54 |   if (node && _this.shouldUpdateScroll(prevProps, _this.props)) {
  55 |     node.scrollIntoView();
View compiled
ScrollHandler.componentDidMount
src/app/www/frontend/node_modules/gatsby-react-router-scroll/scroll-handler.js:89
  86 |   if (scrollPosition) {
  87 |     this.windowScroll(scrollPosition, undefined);
  88 |   } else if (hash) {
> 89 |     this.scrollToHash(decodeURI(hash), undefined);
  90 |   }
  91 | };
  92 | 

Строка, которая, как мне кажется, вызывает проблему, это auth.parseHash(setSession()) в файле аутентификации js из учебника.

Эта функция, parseHa sh, принимает hash в качестве входных данных согласно этой странице: https://auth0.com/docs/libraries/auth0js/v9

Но scrollToHash в обработчике прокрутки. js делает то же самое, поэтому похоже, обработчик прокрутки пытается использовать неверную информацию в querySelector.

Хотя я думаю, что это источник проблемы, я не уверен, как go решить эту проблему. На странице обратного вызова мне не нужен обработчик прокрутки, потому что единственное, что на странице, - это текст с надписью «Загрузка ...». Можно ли отключить эту функцию для этой страницы? В качестве альтернативы я не уверен, смогу ли я заставить код не использовать неправильную переменную ha sh.

Answer 1

Это ошибка в Gatsby, которая была исправлена ​​ в очень недавнем PR .

Проблема в том, что он интерпретирует ha sh из Auth0 как тег привязки для прокрутки, но затем происходит сбой, потому что он содержит символы, которые в теге привязки никогда не может быть (возможно, тире).

Если вы обновитесь до последней версии Gatsby (или любой версии после 2.23.7), это должно быть исправлено.