diff --git a/src/components/BreadcrumbBar.visibility.test.tsx b/src/components/BreadcrumbBar.visibility.test.tsx
new file mode 100644
index 00000000..328f5483
--- /dev/null
+++ b/src/components/BreadcrumbBar.visibility.test.tsx
@@ -0,0 +1,59 @@
+import { render, screen } from '@testing-library/react'
+import { describe, expect, it, vi } from 'vitest'
+import { BreadcrumbBar } from './BreadcrumbBar'
+import './Editor.css'
+import type { VaultEntry } from '../types'
+
+const baseEntry: VaultEntry = {
+  path: '/vault/note/test.md',
+  filename: 'test.md',
+  title: 'Test Note',
+  isA: 'Note',
+  aliases: [],
+  belongsTo: [],
+  relatedTo: [],
+  status: null,
+  archived: false,
+  modifiedAt: 1700000000,
+  createdAt: null,
+  fileSize: 100,
+  snippet: '',
+  wordCount: 0,
+  relationships: {},
+  icon: null,
+  color: null,
+  order: null,
+  outgoingLinks: [],
+  template: null,
+  sort: null,
+  sidebarLabel: null,
+  view: null,
+  visible: null,
+  properties: {},
+  organized: false,
+  favorite: false,
+  favoriteIndex: null,
+  listPropertiesDisplay: [],
+  hasH1: false,
+}
+
+const defaultProps = {
+  wordCount: 100,
+  showDiffToggle: false,
+  diffMode: false,
+  diffLoading: false,
+  onToggleDiff: vi.fn(),
+}
+
+describe('BreadcrumbBar filename visibility', () => {
+  it('keeps the filename visible in the breadcrumb by default', () => {
+    render(<BreadcrumbBar entry={baseEntry} {...defaultProps} />)
+    expect(screen.getByText('test')).toBeVisible()
+  })
+
+  it('keeps the filename visible even when the bar is marked as title-hidden', () => {
+    const { container } = render(<BreadcrumbBar entry={baseEntry} {...defaultProps} />)
+    container.querySelector('.breadcrumb-bar')?.setAttribute('data-title-hidden', '')
+    expect(screen.getByText('test')).toBeVisible()
+  })
+})
diff --git a/src/components/Editor.css b/src/components/Editor.css
index ca7b311a..b96e4035 100644
--- a/src/components/Editor.css
+++ b/src/components/Editor.css
@@ -22,7 +22,8 @@
   opacity: 0.55;
 }
 
-/* Breadcrumb bar: title + border toggled via data attribute (no React re-render) */
+/* Breadcrumb bar: border can still react to the data attribute, but the
+   breadcrumb filename/title stays visible at all times. */
 .breadcrumb-bar {
   transition: border-color 0.2s ease;
 }
@@ -32,10 +33,6 @@
 }
 
 .breadcrumb-bar__title {
-  display: none;
-}
-
-.breadcrumb-bar[data-title-hidden] .breadcrumb-bar__title {
   display: flex;
 }