[full-ci] Redesign Breadcrumb (#6472)

* Fit text color darkmode to figma

Use ods rc.2

Add changelog

Try to fix locator in e2e

Fix navigateToAllFiles in copyOrMove in e2e tests

Add changelog item for ODS update

Update ODS changelog entry

Fix more breadcrumb selectors

Bump ODS to rc-3

* Bump ODS to v12.2.0

Bump minor test dependencies

Dedupe dependency bump

Don't bump playwright

Bump playwright test deps

Co-authored-by: Pascal Wengerter <pascal@wengerter.info>

changelog/unreleased/enhancement-redesign-breadcrumb

@@ -0,0 +1,7 @@
+Enhancement: Redesign OcBreadcrumb
+
+We've adjustet the look of the OcBreadcrumb
+to fit the Redesign
+
+https://github.com/owncloud/web/issues/6218
+https://github.com/owncloud/web/pull/6472

changelog/unreleased/enhancement-update-ods

@@ -0,0 +1,11 @@
+Enhancement: Update ODS to v12.2.0
+
+We updated the ownCloud Design System to version 12.2.0. Please refer to the full changelog in the ODS release (linked) for more details. Summary:
+
+- Enhancement - Apply outstanding background color to oc-card: https://github.com/owncloud/owncloud-design-system/pull/1974
+- Enhancement - Redesign OcBreadcrumb: https://github.com/owncloud/web/issues/6218
+- Enhancement - Redesign files table related components: https://github.com/owncloud/owncloud-design-system/pull/1958
+
+https://github.com/owncloud/web/pull/6450
+https://github.com/owncloud/web/pull/6472
+https://github.com/owncloud/owncloud-design-system/releases/tag/v12.2.0

package.json

@@ -48,7 +48,7 @@
  "@cucumber/messages": "^17.1.1",
  "@cucumber/pretty-formatter": "^1.0.0-alpha.1",
  "@noble/hashes": "^1.0.0",
- "@playwright/test": "^1.17.2",
+ "@playwright/test": "^1.19.2",
  "@rollup/plugin-alias": "^3.1.9",
  "@rollup/plugin-commonjs": "^17.0.0",
  "@rollup/plugin-html": "^0.2.4",
@@ -66,7 +66,7 @@
  "@types/node-fetch": "^2.6.0",
  "@typescript-eslint/eslint-plugin": "^5.11.0",
  "@typescript-eslint/parser": "^5.11.0",
- "@vue/test-utils": "^1.2.2",
+ "@vue/test-utils": "^1.3.0",
  "autoprefixer": "^10.4.2",
  "babel-core": "^7.0.0-bridge.0",
  "babel-jest": "^27.0.6",
@@ -79,7 +79,7 @@
  "eslint-config-prettier": "^6.10.0",
  "eslint-config-standard": "^16.0.3",
  "eslint-plugin-import": "^2.25.2",
- "eslint-plugin-jest": "^24.1.3",
+ "eslint-plugin-jest": "^26.1.1",
  "eslint-plugin-node": "^11.1.0",
  "eslint-plugin-prettier": "^4.0.0",
  "eslint-plugin-promise": "^5.2.0",
@@ -98,7 +98,7 @@
  "node-fetch": "^2.6.7",
  "pino": "^7.6.3",
  "pino-pretty": "^7.3.0",
- "playwright": "^1.17.1",
+ "playwright": "^1.19.2",
  "postcss": "^8.3.6",
  "prettier": "^2.3.2",
  "react": "^17.0.2",

packages/web-runtime/package.json

@@ -17,7 +17,7 @@
  "lodash-es": "^4.17.21",
  "luxon": "^2.3.0",
  "oidc-client": "1.11.5",
- "owncloud-design-system": "12.1.1-rc1",
+ "owncloud-design-system": "12.2.0",
  "owncloud-sdk": "~2.0.0",
  "p-queue": "^6.1.1",
  "popper-max-size-modifier": "^0.2.0",

packages/web-runtime/themes/owncloud/theme.json

@@ -122,7 +122,7 @@
  "swatch-warning-default": "",
  "swatch-warning-hover": "",
  "swatch-warning-muted": "",
- "text-default": "#dadcdf",
+ "text-default": "#ffffff",
  "text-inverse": "#000000",
  "text-muted": "#696969",
  "icon-folder": "rgb(44, 101, 255)",
@@ -159,4 +159,4 @@
  }
  }
  }
-}
+}

tests/acceptance/pageObjects/personalPage.js

@@ -360,7 +360,7 @@ module.exports = {
  },
  resourceBreadcrumb: {
  selector:
- '//nav[@id="files-breadcrumb"]//*[(self::a or self::button) and contains(text(),%s)]',
+ '//nav[@id="files-breadcrumb"]//*[(self::a or self::button)]/span[contains(text(),%s)]',
  locateStrategy: 'xpath'
  },
  resourceBreadcrumbNonClickable: {

tests/e2e/support/page/files/allFiles.ts

@@ -229,7 +229,7 @@ export class AllFilesPage {
 
  await page.locator(`//*[@data-test-resource-name="${resourceBase}"]`).click({ button: 'right' })
  await page.locator(`.oc-files-actions-${action}-trigger`).first().click()
- await page.locator('//ol[@class="oc-breadcrumb-list"]/li/*[1]').first().click()
+ await page.locator('//nav[contains(@class, "oc-breadcrumb")]/ol/li[1]/a').click()
 
  if (newLocation !== 'All files') {
  await filesCta.navigateToFolder({ page: page, path: newLocation })