Merge pull request #35739 from overleaf/mfb-bring-main-bibliography-to-top-level

Bring main bibliography file to the top level settings GitOrigin-RevId: 4c4d4927067995d947c6d0656425760ce56f9435
2026-11-15 14:43:46 +01:00 · 2026-09-17 11:36:48 +00:00
parent 6f8a1be171
commit 02d36687cd
22 changed files with 406 additions and 13 deletions
@@ -0,0 +1,79 @@
+import { screen, within, render } from '@testing-library/react'
+import { expect } from 'chai'
+import fetchMock from 'fetch-mock'
+import { SettingsModalProvider } from '@/features/ide-settings/context/settings-modal-context'
+import {
+  EditorProviders,
+  projectDefaults,
+} from '../../../helpers/editor-providers'
+import ReferenceFormatSetting from '@/features/ide-settings/components/reference-settings/reference-format-setting'
+import userEvent from '@testing-library/user-event'
+
+// bibtex is listed first as it differs from the component's default
+// ('biblatex'), so selecting it is guaranteed to trigger a change.
+const OPTIONS = [
+  {
+    label: 'BibTeX',
+    value: 'bibtex',
+  },
+  {
+    label: 'BibLaTeX',
+    value: 'biblatex',
+  },
+]
+
+describe('<ReferenceFormatSetting />', function () {
+  afterEach(function () {
+    fetchMock.removeRoutes().clearHistory()
+  })
+
+  it('defaults to BibLaTeX', function () {
+    render(
+      <EditorProviders>
+        <SettingsModalProvider>
+          <ReferenceFormatSetting />
+        </SettingsModalProvider>
+      </EditorProviders>
+    )
+
+    const select = screen.getByLabelText(
+      'Reference format'
+    ) as HTMLSelectElement
+    expect(select.value).to.equal('biblatex')
+  })
+
+  it('each option is shown and can be selected', async function () {
+    render(
+      <EditorProviders>
+        <SettingsModalProvider>
+          <ReferenceFormatSetting />
+        </SettingsModalProvider>
+      </EditorProviders>
+    )
+
+    const saveSettingsMock = fetchMock.post(
+      `express:/project/:projectId/settings`,
+      {
+        status: 200,
+      },
+      { delay: 0 }
+    )
+
+    const select = screen.getByLabelText('Reference format')
+
+    for (const option of OPTIONS) {
+      const optionElement = within(select).getByText(option.label)
+      expect(optionElement.getAttribute('value')).to.equal(option.value)
+      await userEvent.selectOptions(select, [optionElement])
+
+      expect(
+        saveSettingsMock.callHistory.called(
+          `/project/${projectDefaults._id}/settings`,
+          {
+            body: { referenceFormat: option.value },
+          }
+        )
+      ).to.be.true
+    }
+  })
+})
@@ -0,0 +1,105 @@
+import { screen, within, render } from '@testing-library/react'
+import { expect } from 'chai'
+import fetchMock from 'fetch-mock'
+import { Folder } from '../../../../../types/folder'
+import { SettingsModalProvider } from '@/features/ide-settings/context/settings-modal-context'
+import {
+  EditorProviders,
+  projectDefaults,
+} from '../../../helpers/editor-providers'
+import RootBibDocumentSetting from '@/features/ide-settings/components/reference-settings/root-bib-document-setting'
+import userEvent from '@testing-library/user-event'
+
+const OPTIONS = [
+  {
+    label: 'main.bib',
+    value: '123abc',
+  },
+  {
+    label: 'another.bib',
+    value: '123abcd',
+  },
+]
+
+describe('<RootBibDocumentSetting />', function () {
+  const rootFolder: Folder = {
+    _id: 'root-folder-id',
+    name: 'rootFolder',
+    docs: [
+      {
+        _id: '123abc',
+        name: 'main.bib',
+      },
+      {
+        _id: '123abcd',
+        name: 'another.bib',
+      },
+      {
+        _id: '123abce',
+        name: 'main.tex',
+      },
+    ],
+    fileRefs: [],
+    folders: [],
+  }
+
+  afterEach(function () {
+    fetchMock.removeRoutes().clearHistory()
+  })
+
+  it('only lists .bib files as options', function () {
+    render(
+      <EditorProviders rootFolder={[rootFolder as any]}>
+        <SettingsModalProvider>
+          <RootBibDocumentSetting />
+        </SettingsModalProvider>
+      </EditorProviders>
+    )
+
+    const select = screen.getByLabelText(
+      'Main bibliography file for this project'
+    )
+
+    expect(within(select).getByText('main.bib')).to.exist
+    expect(within(select).getByText('another.bib')).to.exist
+    expect(within(select).queryByText('main.tex')).to.be.null
+  })
+
+  it('each option is shown and can be selected', async function () {
+    render(
+      <EditorProviders rootFolder={[rootFolder as any]}>
+        <SettingsModalProvider>
+          <RootBibDocumentSetting />
+        </SettingsModalProvider>
+      </EditorProviders>
+    )
+
+    const saveSettingsMock = fetchMock.post(
+      `express:/project/:projectId/settings`,
+      {
+        status: 200,
+      },
+      { delay: 0 }
+    )
+
+    const select = screen.getByLabelText(
+      'Main bibliography file for this project'
+    )
+
+    // Reverse order so we test changing to each option
+    for (const option of [...OPTIONS].reverse()) {
+      const optionElement = within(select).getByText(option.label)
+      expect(optionElement.getAttribute('value')).to.equal(option.value)
+      await userEvent.selectOptions(select, [optionElement])
+
+      expect(
+        saveSettingsMock.callHistory.called(
+          `/project/${projectDefaults._id}/settings`,
+          {
+            body: { mainBibliographyDocId: option.value },
+          }
+        )
+      ).to.be.true
+    }
+  })
+})