Handle UiKit & iconMaterial removal

Bump web-test-middleware in CI

Remove fileUpload volumes in CI, bump web to official v5.0.0

Rename web changelog & fix settings acceptance test

Add 'Spaces' to settings navBar tests

Add new profile link & quota to settings userMenu tests

Update expected failures from web v5.0.0 release

Bump web commit ID

.drone.env

@@ -3,5 +3,5 @@ CORE_COMMITID=b33853030d88a6b530ab411b86539ac6eb9970b8
 CORE_BRANCH=master
 
 # The test runner source for UI tests
-WEB_COMMITID=e84960674723d8fb8c3c42e1ada8ef8cc1747ba6
+WEB_COMMITID=fbfef7c48676cdc4a492b56f9e07856534910e6a
 WEB_BRANCH=master

.drone.star

@@ -7,7 +7,7 @@ OC_CI_GOLANG = "owncloudci/golang:1.17"
 OC_CI_NODEJS = "owncloudci/nodejs:14"
 OC_CI_PHP = "owncloudci/php:7.4"
 OC_CI_WAIT_FOR = "owncloudci/wait-for:latest"
-OC_TESTING_MIDDLEWARE = "owncloud/owncloud-test-middleware:1.3.0"
+OC_TESTING_MIDDLEWARE = "owncloud/owncloud-test-middleware:1.3.1"
 MINIO_MC = "minio/mc:RELEASE.2021-10-07T04-19-58Z"
 REDIS = "redis:6-alpine"
 
@@ -635,16 +635,10 @@ def uiTestPipeline(ctx, filterTags, early_fail, runPart = 1, numberOfParts = 1,
                     "git clone -b $WEB_BRANCH --single-branch --no-tags https://github.com/owncloud/web.git /srv/app/web",
                     "cd /srv/app/web",
                     "git checkout $WEB_COMMITID",
-                    "cp -r tests/acceptance/filesForUpload/* /uploads",
                     "cd tests/acceptance/",
                     "yarn install --immutable",
                     "./run.sh",
                 ],
-                "volumes": [stepVolumeOC10Tests] +
-                           [{
-                               "name": "uploads",
-                               "path": "/uploads",
-                           }],
             },
         ] + failEarly(ctx, early_fail),
         "services": selenium() + middlewareService(),

accounts/ui/app.js

@@ -12,8 +12,7 @@ const appInfo = {
   name: $gettext('Accounts'),
   id: 'accounts',
   icon: 'team',
-  isFileEditor: false,
-  extensions: []
+  isFileEditor: false
 }
 
 const routes = [
@@ -27,7 +26,7 @@ const routes = [
 const navItems = [
   {
     name: $gettext('Accounts'),
-    iconMaterial: appInfo.icon,
+    icon: appInfo.icon,
     route: {
       name: 'accounts',
       path: `/${appInfo.id}/`

accounts/ui/components/App.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <main class="uk-flex uk-flex-column uk-height-1-1 oc-px-s" id="accounts-app">
+    <main class="oc-flex oc-flex-column oc-height-1-1 oc-p-m" id="accounts-app">
       <template v-if="isInitialized">
         <h1 class="oc-invisible-sr">
           <translate>Accounts</translate>
@@ -13,15 +13,24 @@
           />
           <accounts-create v-else />
         </div>
-        <oc-grid class="uk-flex-1 uk-overflow-auto">
-          <div class="uk-width-expand">
+        <oc-grid class="oc-flex-1 oc-overflow-auto">
+          <div class="oc-width-expand">
             <accounts-list :accounts="accounts" />
           </div>
         </oc-grid>
       </template>
       <template v-else-if="hasFailed">
-        <oc-alert variation="warning" no-close class="oc-m" id="accounts-list-loading-failed">
-          <oc-icon name="error-warning" variation="warning" class="uk-float-left oc-mr-s" />
+        <oc-alert
+          variation="warning"
+          no-close
+          class="oc-m"
+          id="accounts-list-loading-failed"
+        >
+          <oc-icon
+            name="error-warning"
+            variation="warning"
+            class="oc-float-left oc-mr-s"
+          />
           <translate>You don't have permissions to manage accounts.</translate>
         </oc-alert>
       </template>
@@ -40,7 +49,12 @@ export default {
   name: 'App',
   components: { AccountsBatchActions, AccountsList, AccountsCreate },
   computed: {
-    ...mapGetters('Accounts', ['isInitialized', 'hasFailed', 'getAccountsSorted', 'isAnyAccountSelected']),
+    ...mapGetters('Accounts', [
+      'isInitialized',
+      'hasFailed',
+      'getAccountsSorted',
+      'isAnyAccountSelected'
+    ]),
     ...mapState('Accounts', ['selectedAccounts']),
 
     accounts () {

accounts/ui/components/accounts/AccountsBatchActions.vue

@@ -1,22 +1,45 @@
 <template>
-  <oc-grid key="selected-accounts-info" gutter="small" class="uk-flex-middle">
+  <oc-grid key="selected-accounts-info" gutter="small" class="oc-flex-middle">
     <span v-text="selectionInfoText" />
     <span>|</span>
     <div>
-      <oc-button v-text="$gettext('Clear selection')" appearance="raw" @click="RESET_ACCOUNTS_SELECTION" />
+      <oc-button
+        v-text="$gettext('Clear selection')"
+        appearance="raw"
+        @click="RESET_ACCOUNTS_SELECTION"
+      />
     </div>
     <oc-grid gutter="small" id="accounts-batch-actions">
       <div v-for="action in actions" :key="action.label">
-        <div v-if="isConfirmationInProgress[action.id]" :variation="action.confirmation.variation || 'primary'" noClose class="uk-flex uk-flex-middle tmp-alert-fixes">
+        <div
+          v-if="isConfirmationInProgress[action.id]"
+          :variation="action.confirmation.variation || 'primary'"
+          noClose
+          class="oc-flex oc-flex-middle tmp-alert-fixes"
+        >
           <span>{{ action.confirmation.message }}</span>
-          <oc-button :id="action.confirmation.cancel.id" @click="action.confirmation.cancel.handler" :variation="action.confirmation.cancel.variation || 'passive'">
+          <oc-button
+            :id="action.confirmation.cancel.id"
+            @click="action.confirmation.cancel.handler"
+            :variation="action.confirmation.cancel.variation || 'passive'"
+          >
             {{ action.confirmation.cancel.label }}
           </oc-button>
-          <oc-button :id="action.confirmation.confirm.id" @click="action.confirmation.confirm.handler" :variation="action.confirmation.confirm.variation || 'primary'">
+          <oc-button
+            :id="action.confirmation.confirm.id"
+            @click="action.confirmation.confirm.handler"
+            :variation="action.confirmation.confirm.variation || 'primary'"
+          >
             {{ action.confirmation.confirm.label }}
           </oc-button>
         </div>
-        <oc-button v-else :id="action.id" @click="action.handler" :variation="action.variation || 'primary'" :icon="action.icon">
+        <oc-button
+          v-else
+          :id="action.id"
+          @click="action.handler"
+          :variation="action.variation || 'primary'"
+          :icon="action.icon"
+        >
           {{ action.label }}
         </oc-button>
       </div>

accounts/ui/components/accounts/AccountsCreate.vue

@@ -28,7 +28,7 @@
         :disabled="isRequestInProgress"
         @keydown.enter="createAccount"
       />
-      <div class="uk-flex">
+      <div class="oc-flex">
         <oc-button
           class="oc-mr-s oc-mb-s"
           v-text="$gettext('Cancel')"
@@ -51,7 +51,11 @@
             size="small"
             aria-hidden="true"
           />
-          <span v-text="isRequestInProgress ? $gettext('Creating') : $gettext('Create')" />
+          <span
+            v-text="
+              isRequestInProgress ? $gettext('Creating') : $gettext('Create')
+            "
+          />
         </oc-button>
       </div>
     </oc-grid>

accounts/ui/components/accounts/AccountsList.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <oc-table-simple id="accounts-user-list">
+    <oc-table-simple id="accounts-user-list" class="oc-mt-l">
       <oc-thead>
         <oc-tr>
           <oc-th shrink type="head" align-h="center">
@@ -17,7 +17,12 @@
           <oc-th type="head" v-text="$gettext('Display name')" />
           <oc-th type="head" v-text="$gettext('Email')" />
           <oc-th type="head" v-text="$gettext('Role')" />
-          <oc-th shrink type="head" v-text="$gettext('Activated')" align-h="center"/>
+          <oc-th
+            shrink
+            type="head"
+            v-text="$gettext('Activated')"
+            align-h="center"
+          />
         </oc-tr>
       </oc-thead>
       <oc-tbody>

accounts/ui/components/accounts/AccountsListRow.vue

@@ -12,15 +12,23 @@
       />
     </oc-td>
     <oc-td>
-      <avatar :user-name="account.displayName || account.onPremisesSamAccountName" :userid="account.id" :width="35" />
+      <avatar
+        :user-name="account.displayName || account.onPremisesSamAccountName"
+        :userid="account.id"
+        :width="35"
+      />
     </oc-td>
     <oc-td v-text="account.onPremisesSamAccountName" />
     <oc-td v-text="account.displayName || '-'" />
     <oc-td v-text="account.mail" />
     <oc-td>
-      <oc-button :id="`accounts-roles-select-trigger-${account.id}`" class="accounts-roles-select-trigger" appearance="outline">
-        <span class="uk-flex uk-flex-middle accounts-roles-current-role">
-          {{ currentRole ? currentRole.displayName : $gettext('Select role') }}
+      <oc-button
+        :id="`accounts-roles-select-trigger-${account.id}`"
+        class="accounts-roles-select-trigger"
+        appearance="outline"
+      >
+        <span class="oc-flex oc-flex-middle accounts-roles-current-role">
+          {{ currentRole ? currentRole.displayName : $gettext("Select role") }}
           <oc-icon name="arrow-down-s" aria-hidden="true" />
         </span>
       </oc-button>
@@ -31,7 +39,7 @@
         close-on-click
         :options="{ delayHide: 0 }"
       >
-        <ul class="uk-list">
+        <ul class="oc-list">
           <li v-for="role in roles" :key="role.id">
             <oc-radio
               class="accounts-roles-dropdown-role"

settings/ui/app.js

@@ -4,16 +4,15 @@ import store from './store'
 import translations from './../l10n/translations.json'
 
 // just a dummy function to trick gettext tools
-function $gettext (msg) {
+function $gettext(msg) {
   return msg
 }
 
 const appInfo = {
   name: $gettext('Settings'),
   id: 'settings',
   icon: 'settings-4',
-  isFileEditor: false,
-  extensions: []
+  isFileEditor: false
 }
 
 const routes = [
@@ -27,7 +26,7 @@ const routes = [
 const navItems = [
   {
     name: $gettext('Settings'),
-    iconMaterial: appInfo.icon,
+    icon: appInfo.icon,
     route: {
       name: 'settings',
       path: `/${appInfo.id}/`

settings/ui/components/SettingsApp.vue

@@ -1,16 +1,16 @@
 <template>
   <div class="oc-p">
-    <main class="uk-flex uk-flex-column" id="settings-app">
+    <main class="oc-flex oc-flex-column" id="settings-app">
       <template v-if="initialized">
         <oc-alert v-if="extensions.length === 0" variation="primary" no-close>
-          <p class="uk-flex uk-flex-middle">
+          <p class="oc-flex oc-flex-middle">
             <oc-icon name="information" class="oc-mr-s" />
             <translate>No settings available</translate>
           </p>
         </oc-alert>
         <template v-else>
           <template v-if="selectedExtensionName">
-            <div class="uk-flex uk-flex-between uk-flex-middle">
+            <div class="oc-flex oc-flex-between oc-flex-middle">
               <h1 class="oc-page-title">
                 {{ selectedExtensionName }}
               </h1>
@@ -96,7 +96,7 @@ export default {
          */
         const navItem = {
           name: this.getExtensionName(extension),
-          iconMaterial: this.getExtensionIcon(extension),
+          icon: this.getExtensionIcon(extension),
           route: {
             name: 'settings',
             path: `/settings/${extension}`
@@ -126,7 +126,7 @@ export default {
       extension = extension || ''
       switch (extension) {
         case 'ocis-accounts':
-          return 'account_circle'
+          return 'team'
         case 'ocis-hello':
           return 'tag_faces'
         default:

settings/ui/components/SettingsBundle.vue

@@ -1,19 +1,26 @@
 <template>
-  <div class="uk-width-1-1 uk-width-2-3@m uk-width-1-2@l uk-width-1-3@xl">
+  <div class="oc-width-1-1 oc-width-2-3@m oc-width-1-2@l oc-width-1-3@xl">
     <h2 class="oc-mb-s">
       <translate>{{ bundle.displayName }}</translate>
     </h2>
     <oc-grid gutter="small">
       <template>
-        <div class="uk-width-1-1" v-for="setting in bundle.settings" :key="setting.id">
-          <label class="oc-label" :for="setting.id">{{ setting.displayName }}</label>
-          <div class="uk-position-relative"
-               :is="getSettingComponent(setting)"
-               :id="setting.id"
-               :bundle="bundle"
-               :setting="setting"
-               :persisted-value="getValue(setting)"
-               @onSave="onSaveValue"
+        <div
+          class="oc-width-1-1"
+          v-for="setting in bundle.settings"
+          :key="setting.id"
+        >
+          <label class="oc-label" :for="setting.id">{{
+            setting.displayName
+          }}</label>
+          <div
+            class="oc-position-relative"
+            :is="getSettingComponent(setting)"
+            :id="setting.id"
+            :bundle="bundle"
+            :setting="setting"
+            :persisted-value="getValue(setting)"
+            @onSave="onSaveValue"
           />
         </div>
       </template>

settings/ui/components/settings/SettingNumber.vue

@@ -1,6 +1,6 @@
 <template>
   <oc-grid flex>
-    <div class="uk-width-expand">
+    <div class="oc-width-expand">
       <oc-text-input
         type="number"
         v-model="value"

settings/ui/components/settings/SettingString.vue

@@ -1,6 +1,6 @@
 <template>
   <oc-grid flex>
-    <div class="uk-width-expand">
+    <div class="oc-width-expand">
       <oc-text-input
         v-model="value"
         :placeholder="setting.stringValue.placeholder"

settings/ui/tests/acceptance/features/settings.feature

@@ -8,7 +8,7 @@ Feature: Set user specific settings
 			| username |
 			| user1    |
 			| user2    |
-		And user "user1" has created folder "simple-folder"
+		And user "user1" has created folder "simple-folder" in the server
 
 	Scenario: Check the default settings
 		Given user "user1" has logged in using the webUI