Allow paths in the breadcrumb to wrap

In the testing farm gating environment the hostname is quite long which
changed the overall layout to have 3 items in the top row and one in the
bottom row. This causes the keyboard nav to fail and in general layout
issues, the problem is that we breadcrumbs should not be buttons but
anchors this will be worked on in a follow up.

src/app.scss

@@ -94,6 +94,12 @@
 .breadcrumb {
     &-button {
         padding-inline: 0;
+        // HACK: override PF button behaviour, breadcrumbs should
+        // be links not button and then we should be able to remove these
+        // overrides.
+        // https://github.com/cockpit-project/cockpit-files/issues/641
+        overflow-wrap: break-word;
+        white-space: normal;
 
         &.breadcrumb-0 {
             margin-inline-start: var(--pf-v5-global--spacer--sm);

test/check-application

@@ -1178,12 +1178,19 @@ class TestFiles(testlib.MachineCase):
         b.wait_visible("[data-item='file0'].row-selected")
 
         b.key("ArrowDown")
-        b.wait_js_cond("""ph_is_visible("[data-item='file2'].row-selected") ||
-                          ph_is_visible("[data-item='file3'].row-selected")""")
+        b.wait_visible("[data-item='file2'].row-selected")
 
         b.key("ArrowUp")
         b.wait_visible("[data-item='file0'].row-selected")
 
+        # Test with very long hostnames
+        original_hostname = m.execute('hostnamectl hostname').strip()
+        self.addCleanup(m.execute, ['hostnamectl', 'set-hostname', original_hostname])
+        # length of testing farm hostname
+        m.execute('hostnamectl set-hostname aaaaaaaa-bbbb-cccc-dddd-eeeeeeeeee.testing-farm')
+        b.key("ArrowDown")
+        b.wait_visible("[data-item='file2'].row-selected")
+
         m.execute("mkdir /home/admin/foo")
         b.click("[data-item='foo']")