TypeError: Cannot read properties of undefined (reading 'searchPagePath') using Typesense theme #8623

ian-buse · 2023-02-02T21:35:07Z

Have you read the Contributing Guidelines on issues?

I have read the Contributing Guidelines on issues.

Prerequisites

I'm using the latest version of Docusaurus.
I have tried the npm run clear or yarn clear command.
I have tried rm -rf node_modules yarn.lock package-lock.json and re-installing packages.
I have tried creating a repro with https://new.docusaurus.io.
I have read the console error message carefully (if applicable).

Description

I am running a fresh Docusaurus installation on the latest version (2.3.0), and I've been hitting this error every time I attempt to build my site with the docusaurus-theme-search-typesense@next theme.

772f76ad2c7e:/testdocs# yarn run build
yarn run v1.22.19
$ docusaurus build
[INFO] [en] Creating an optimized production build...

✔ Client


✖ Server
  Compiled with some errors in 2.53m

[ERROR] Docusaurus server-side rendering could not render static page with path /search.


TypeError: Cannot read properties of undefined (reading 'searchPagePath')
[ERROR] Unable to build website for locale en.

● Client █████████████████████████ cache (99%) shutdown IdleFileCachePlugin
 resolve build dependencies

● Server █████████████████████████ cache (99%) shutdown IdleFileCachePlugin
 process pending cache items

[ERROR] Error: Failed to compile with errors.
    at /testdocs/node_modules/@docusaurus/core/lib/webpack/utils.js:180:24
    at /testdocs/node_modules/webpack/lib/MultiCompiler.js:554:14
    at processQueueWorker (/testdocs/node_modules/webpack/lib/MultiCompiler.js:491:6)
    at process.processTicksAndRejections (node:internal/process/task_queues:77:11)
[INFO] Docusaurus version: 2.3.0
Node version: v19.5.0
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

I have a cached older version that I tested this against, and it was able to build successfully. This seems to be an issue with 2.3.0, and I noticed #8539 mentions this searchPagePath variable.

I wasn't able to get the sandbox to work the way I needed it to, but I've included the repro steps below along with a sample docusaurus.config.js.

I've included some additional output below showing how I tested this. In the output below, I show I have docusaurus@2.2.0 installed, I installed typesense, and ran a build that succeeded. Then I upgraded Docusaurus, ran a build, and got the error.

~install Docusaurus~

772f76ad2c7e:/# cat testdocs/package.json
{
  "name": "test-docs",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "docusaurus": "docusaurus",
    "start": "docusaurus start",
    "build": "docusaurus build",
    "swizzle": "docusaurus swizzle",
    "deploy": "docusaurus deploy",
    "clear": "docusaurus clear",
    "serve": "docusaurus serve",
    "write-translations": "docusaurus write-translations",
    "write-heading-ids": "docusaurus write-heading-ids"
  },
  "dependencies": {
    "@docusaurus/core": "2.2.0",
    "@docusaurus/preset-classic": "2.2.0",
    "@mdx-js/react": "^1.6.22",
    "clsx": "^1.2.1",
    "prism-react-renderer": "^1.3.5",
    "react": "^17.0.2",
    "react-dom": "^17.0.2"
  },
  "devDependencies": {
    "@docusaurus/module-type-aliases": "2.2.0"
  },
  "browserslist": {
    "production": [
      ">0.5%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "engines": {
    "node": ">=16.14"
  }
}
772f76ad2c7e:/testdocs# yarn add docusaurus-theme-search-typesense@next
yarn add v1.22.19
[1/5] Validating package.json...
[2/5] Resolving packages...
[3/5] Fetching packages...
[4/5] Linking dependencies...
warning "@docusaurus/core > react-loadable-ssr-addon-v5-slorber@1.0.1" has unmet peer dependency "react-loadable@*".
warning "@docusaurus/core > react-dev-utils > fork-ts-checker-webpack-plugin@6.5.2" has unmet peer dependency "typescript@>= 2.7".
warning "docusaurus-theme-search-typesense > algoliasearch-helper@3.11.3" has unmet peer dependency "algoliasearch@>= 3.1 < 6".
warning "@docusaurus/preset-classic > @docusaurus/theme-search-algolia > @docsearch/react > @algolia/autocomplete-preset-algolia@1.7.4" has unmet peer dependency "@algolia/client-search@>= 4.9.1 < 6".
warning "docusaurus-theme-search-typesense > typesense-docsearch-react@0.2.3" has unmet peer dependency "@types/react@>= 16.8.0 < 19.0.0".
warning "docusaurus-theme-search-typesense > typesense-instantsearch-adapter@2.5.0" has unmet peer dependency "@babel/runtime@^7.17.2".
warning "docusaurus-theme-search-typesense > typesense-docsearch-react > typesense@1.5.0" has unmet peer dependency "@babel/runtime@^7.17.2".
warning "docusaurus-theme-search-typesense > typesense-docsearch-react > @algolia/autocomplete-preset-algolia@1.7.1" has unmet peer dependency "@algolia/client-search@^4.9.1".
warning "docusaurus-theme-search-typesense > typesense-docsearch-react > @algolia/autocomplete-preset-algolia@1.7.1" has unmet peer dependency "algoliasearch@^4.9.1".
warning " > docusaurus-theme-search-typesense@0.9.0-0" has incorrect peer dependency "@docusaurus/core@2.3.0".
warning " > docusaurus-theme-search-typesense@0.9.0-0" has unmet peer dependency "@docusaurus/theme-common@2.3.0".
[5/5] Building fresh packages...
success Saved lockfile.
success Saved 8 new dependencies.
info Direct dependencies
└─ docusaurus-theme-search-typesense@0.9.0-0
info All dependencies
├─ @algolia/autocomplete-core@1.7.1
├─ @algolia/autocomplete-preset-algolia@1.7.1
├─ docusaurus-theme-search-typesense@0.9.0-0
├─ loglevel@1.8.1
├─ typesense-docsearch-css@0.3.0
├─ typesense-docsearch-react@0.2.3
├─ typesense-instantsearch-adapter@2.5.0
└─ typesense@1.5.0
Done in 6.61s.
yarn run v1.22.19
$ docusaurus build
[INFO] [en] Creating an optimized production build...

✔ Client


✔ Server
  Compiled successfully in 2.54m


✔ Client


● Server █████████████████████████ cache (99%) shutdown IdleFileCachePlugin
 stored

[SUCCESS] Generated static files in "build".
[INFO] Use `npm run serve` command to test your build locally.
Done in 170.50s.
772f76ad2c7e:/testdocs# rm -rf /testdocs/build/
772f76ad2c7e:/testdocs# yarn upgrade @docusaurus/core@latest @docusaurus/preset-classic@latest
yarn upgrade v1.22.19
[1/5] Validating package.json...
[2/5] Resolving packages...
[3/5] Fetching packages...
[4/5] Linking dependencies...
warning " > docusaurus-theme-search-typesense@0.9.0-0" has unmet peer dependency "@docusaurus/theme-common@2.3.0".
warning "docusaurus-theme-search-typesense > algoliasearch-helper@3.11.3" has unmet peer dependency "algoliasearch@>= 3.1 < 6".
warning "docusaurus-theme-search-typesense > typesense-docsearch-react@0.2.3" has unmet peer dependency "@types/react@>= 16.8.0 < 19.0.0".
warning "docusaurus-theme-search-typesense > typesense-instantsearch-adapter@2.5.0" has unmet peer dependency "@babel/runtime@^7.17.2".
warning "docusaurus-theme-search-typesense > typesense-docsearch-react > @algolia/autocomplete-preset-algolia@1.7.1" has unmet peer dependency "@algolia/client-search@^4.9.1".
warning "docusaurus-theme-search-typesense > typesense-docsearch-react > @algolia/autocomplete-preset-algolia@1.7.1" has unmet peer dependency "algoliasearch@^4.9.1".
warning "docusaurus-theme-search-typesense > typesense-docsearch-react > typesense@1.5.0" has unmet peer dependency "@babel/runtime@^7.17.2".
warning "@docusaurus/core > react-loadable-ssr-addon-v5-slorber@1.0.1" has unmet peer dependency "react-loadable@*".
warning "docusaurus-theme-search-typesense > @docusaurus/plugin-content-docs > @docusaurus/core > react-dev-utils > fork-ts-checker-webpack-plugin@6.5.2" has unmet peer dependency "typescript@>= 2.7".
warning "@docusaurus/preset-classic > @docusaurus/theme-search-algolia > @docsearch/react > @algolia/autocomplete-preset-algolia@1.7.4" has unmet peer dependency "@algolia/client-search@>= 4.9.1 < 6".
[5/5] Rebuilding all packages...
success Saved lockfile.
success Saved 10 new dependencies.
info Direct dependencies
└─ @docusaurus/preset-classic@2.3.0
info All dependencies
├─ @docusaurus/cssnano-preset@2.3.0
├─ @docusaurus/plugin-debug@2.3.0
├─ @docusaurus/plugin-google-analytics@2.3.0
├─ @docusaurus/plugin-google-gtag@2.3.0
├─ @docusaurus/plugin-google-tag-manager@2.3.0
├─ @docusaurus/plugin-sitemap@2.3.0
├─ @docusaurus/preset-classic@2.3.0
├─ @docusaurus/theme-classic@2.3.0
├─ @docusaurus/theme-search-algolia@2.3.0
└─ use-sync-external-store@1.2.0
Done in 10.55s.
772f76ad2c7e:/testdocs# yarn run build
yarn run v1.22.19
$ docusaurus build
[INFO] [en] Creating an optimized production build...

✔ Client


✖ Server
  Compiled with some errors in 2.53m

[ERROR] Docusaurus server-side rendering could not render static page with path /search.


TypeError: Cannot read properties of undefined (reading 'searchPagePath')
[ERROR] Unable to build website for locale en.

● Client █████████████████████████ cache (99%) shutdown IdleFileCachePlugin
 resolve build dependencies

● Server █████████████████████████ cache (99%) shutdown IdleFileCachePlugin
 process pending cache items

[ERROR] Error: Failed to compile with errors.
    at /testdocs/node_modules/@docusaurus/core/lib/webpack/utils.js:180:24
    at /testdocs/node_modules/webpack/lib/MultiCompiler.js:554:14
    at processQueueWorker (/testdocs/node_modules/webpack/lib/MultiCompiler.js:491:6)
    at process.processTicksAndRejections (node:internal/process/task_queues:77:11)
[INFO] Docusaurus version: 2.3.0
Node version: v19.5.0
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Reproducible demo

No response

Steps to reproduce

Install docusaurus yarn create docusaurus testdocs classic
Replace the docusaurus.config.js with the one below.
Add Typesense yarn add docusaurus-theme-search-typesense@next
cd to the testdocs directory
Run yarn run build

// @ts-check
// Note: type annotations allow type checking and IDEs autocompletion

const lightCodeTheme = require('prism-react-renderer/themes/github');
const darkCodeTheme = require('prism-react-renderer/themes/dracula');

/** @type {import('@docusaurus/types').Config} */
const config = {
  title: 'My Site',
  tagline: 'Dinosaurs are cool',
  favicon: 'img/favicon.ico',

  // Set the production url of your site here
  url: 'https://your-docusaurus-test-site.com',
  // Set the /<baseUrl>/ pathname under which your site is served
  // For GitHub pages deployment, it is often '/<projectName>/'
  baseUrl: '/',

  // GitHub pages deployment config.
  // If you aren't using GitHub pages, you don't need these.
  organizationName: 'facebook', // Usually your GitHub org/user name.
  projectName: 'docusaurus', // Usually your repo name.

  onBrokenLinks: 'throw',
  onBrokenMarkdownLinks: 'warn',

  // Even if you don't use internalization, you can use this field to set useful
  // metadata like html lang. For example, if your site is Chinese, you may want
  // to replace "en" with "zh-Hans".
  i18n: {
    defaultLocale: 'en',
    locales: ['en'],
  },

  presets: [
    [
      'classic',
      /** @type {import('@docusaurus/preset-classic').Options} */
      ({
        docs: {
          sidebarPath: require.resolve('./sidebars.js'),
          // Please change this to your repo.
          // Remove this to remove the "edit this page" links.
          editUrl:
            'https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/',
        },
        blog: {
          showReadingTime: true,
          // Please change this to your repo.
          // Remove this to remove the "edit this page" links.
          editUrl:
            'https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/',
        },
        theme: {
          customCss: require.resolve('./src/css/custom.css'),
        },
      }),
    ],
  ],
  themes: ['docusaurus-theme-search-typesense'],
  themeConfig:
    /** @type {import('@docusaurus/preset-classic').ThemeConfig} */
    ({
      typesense: {
        typesenseCollectionName: 'DocusaurusCollection',
        typesenseServerConfig: {
          nodes: [
            {
              host: '192.168.1.100',
              port: 8108,
              protocol: 'http',
            }
          ],
          apiKey: 'xyz'
        },
        typesenseSearchParameters: {},
        contextualSearch: true,
      },
      // Replace with your project's social card
      image: 'img/docusaurus-social-card.jpg',
      navbar: {
        title: 'My Site',
        logo: {
          alt: 'My Site Logo',
          src: 'img/logo.svg',
        },
        items: [
          {
            type: 'doc',
            docId: 'intro',
            position: 'left',
            label: 'Tutorial',
          },
          {to: '/blog', label: 'Blog', position: 'left'},
          {
            href: 'https://github.com/facebook/docusaurus',
            label: 'GitHub',
            position: 'right',
          },
        ],
      },
      footer: {
        style: 'dark',
        links: [
          {
            title: 'Docs',
            items: [
              {
                label: 'Tutorial',
                to: '/docs/intro',
              },
            ],
          },
          {
            title: 'Community',
            items: [
              {
                label: 'Stack Overflow',
                href: 'https://stackoverflow.com/questions/tagged/docusaurus',
              },
              {
                label: 'Discord',
                href: 'https://discordapp.com/invite/docusaurus',
              },
              {
                label: 'Twitter',
                href: 'https://twitter.com/docusaurus',
              },
            ],
          },
          {
            title: 'More',
            items: [
              {
                label: 'Blog',
                to: '/blog',
              },
              {
                label: 'GitHub',
                href: 'https://github.com/facebook/docusaurus',
              },
            ],
          },
        ],
        copyright: `Copyright © ${new Date().getFullYear()} My Project, Inc. Built with Docusaurus.`,
      },
      prism: {
        theme: lightCodeTheme,
        darkTheme: darkCodeTheme,
      },
    }),
};

module.exports = config;

Expected behavior

A successful build.

Actual behavior

Build failed.

Your environment

Docusaurus version used: 2.3.0
Environment name and version (e.g. Chrome 89, Node.js 16.4): Node.js 19.5.0 (containerized)
Operating system and version (e.g. Ubuntu 20.04.2 LTS): Alpine Linux 3.17.1

Self-service

I'd be willing to fix this bug myself.

The text was updated successfully, but these errors were encountered:

slorber · 2023-02-03T11:41:29Z

Hi

Indeed it's the PR (#8539) that broke it by introducing Algolia-specific things to our theme-common package. Retrospectively that seems like a bad idea @Josh-Cena 😅 we'd rather not couple theme-common to anything apart from our 3 content plugins IMHO (btw the deps has not been added to package.json)

However this breaks because the typesense plugin is using Docusaurus internal implementation details and we can't commit to not do changes that annoy plugins. CC @jasonbosco.

There's also this bug reported on the Typesense repo here: typesense/docusaurus-theme-search-typesense#27

If the API is marked as "internal" you should not use it in your code (in particular in plugin code). I can see our internal generateSearchPageLink() is used there:
https://github.com/typesense/docusaurus-theme-search-typesense/blob/1678d5364316bc334bbbe51490a08d5fc11d9abf/src/theme/SearchBar/index.tsx#L71

If you need this code, for now, it's safer to copy/paste it and adapt it to your own need rather than using our internal export.

Workaround that probably works: { themeConfig: { algolia: { searchPagePath: "search" } } }

I'll keep this open for now because I think we should remove the theme-common => algolia dependency.

But the refactor will likely break the typesense plugin again 😅. That's also why I'd prefer if the typesense plugin wasn't relying on this internal API @jasonbosco

jasonbosco · 2023-02-03T23:45:17Z

@slorber Thank you for the heads-up! I essentially forked the built-in Algolia plugin, so I missed noticing that these were internal methods. I've just been regularly syncing the Typesense plugin with upstream changes from the Algolia plugin all these months! 😅

I'll now refactor it to not rely on this internal method. Thank you for the pointers.

facebook/docusaurus#8623 #27

jasonbosco · 2023-02-06T17:30:21Z

I've published 0.9.0 of docusaurus-theme-search-typesense, which solves the core of this issue.

ian-buse added bug An error in the Docusaurus core causing instability or issues with its execution status: needs triage This issue has not been triaged by maintainers labels Feb 2, 2023

slorber removed the status: needs triage This issue has not been triaged by maintainers label Feb 3, 2023

slorber mentioned this issue Feb 3, 2023

Update for Docusaurus ~2.3.0~ 2.3.1 typesense/docusaurus-theme-search-typesense#27

Closed

jasonbosco added a commit to typesense/docusaurus-theme-search-typesense that referenced this issue Feb 4, 2023

Don't rely on @docusaurus/theme-common internal methods.

f5bedc2

facebook/docusaurus#8623 #27

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

TypeError: Cannot read properties of undefined (reading 'searchPagePath') using Typesense theme #8623

TypeError: Cannot read properties of undefined (reading 'searchPagePath') using Typesense theme #8623

ian-buse commented Feb 2, 2023

slorber commented Feb 3, 2023 •

edited

jasonbosco commented Feb 3, 2023 •

edited

jasonbosco commented Feb 6, 2023

TypeError: Cannot read properties of undefined (reading 'searchPagePath') using Typesense theme #8623

TypeError: Cannot read properties of undefined (reading 'searchPagePath') using Typesense theme #8623

Comments

ian-buse commented Feb 2, 2023

Have you read the Contributing Guidelines on issues?

Prerequisites

Description

Reproducible demo

Steps to reproduce

Expected behavior

Actual behavior

Your environment

Self-service

slorber commented Feb 3, 2023 • edited

jasonbosco commented Feb 3, 2023 • edited

jasonbosco commented Feb 6, 2023

slorber commented Feb 3, 2023 •

edited

jasonbosco commented Feb 3, 2023 •

edited