Merge pull request #27 from owncloud/config-loading

Config loading

.drone.star

@@ -135,7 +135,7 @@ def website(ctx):
       },
       {
         'name': 'test',
-        'image': 'webhippie/hugo:latest',
+				'image': 'owncloudci/hugo:0.71.0',
         'commands': [
           'cd hugo',
           'hugo',
@@ -245,31 +245,31 @@ def tests(ctx):
     'steps': [
       {
         'name': 'install',
-        'image': 'owncloudci/nodejs:11',
+        'image': 'owncloudci/nodejs:12',
         'pull': 'always',
         'commands': [
           'yarn install --frozen-lockfile',
         ],
       },
       {
         'name': 'lint',
-        'image': 'owncloudci/nodejs:11',
+        'image': 'owncloudci/nodejs:12',
         'pull': 'always',
         'commands': [
           'yarn lint',
         ],
       },
       {
         'name': 'build',
-        'image': 'owncloudci/nodejs:11',
+        'image': 'owncloudci/nodejs:12',
         'pull': 'always',
         'commands': [
           'yarn build',
         ],
       },
       {
         'name': 'unit',
-        'image': 'owncloudci/nodejs:11',
+        'image': 'owncloudci/nodejs:12',
         'pull': 'always',
         'commands': [
           'yarn test:unit'

.eslintrc.js

@@ -5,7 +5,9 @@ module.exports = {
   },
   extends: ['plugin:vue/recommended', 'eslint:recommended', '@vue/prettier'],
   parserOptions: {
-    parser: 'babel-eslint'
+    parser: "@babel/eslint-parser",
+    ecmaVersion: 6,
+    sourceType: "module"
   },
   rules: {
     'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',

changelog/unreleased/enhancement-config-json

@@ -0,0 +1,5 @@
+Enhancement: Allow string as configObject attribute
+
+The property/attribute "configObject" is now allowed to be a string. We'll parse it as JSON.
+
+https://github.com/owncloud/file-picker/pull/27

jest.config.js

@@ -6,5 +6,6 @@ module.exports = {
     '!./src/main.js',
     '!./src/services/auth.js',
     '!./src/assets/**/*'
-  ]
+  ],
+  setupFiles: ['./tests/unit/config/jest.init.js']
 }

package.json

@@ -3,7 +3,7 @@
   "version": "0.2.0",
   "author": "ownclouders <[email protected]>",
   "description": "Easily integrate ownCloud into your existing products",
-  "type": "module",
+  "type": "commonjs",
   "module": "dist/file-picker.js",
   "main": "dist/file-picker.js",
   "unpkg": "dist/file-picker.min.js",
@@ -44,17 +44,18 @@
     "vue-virtual-scroller": "^1.0.10"
   },
   "devDependencies": {
+    "@babel/eslint-parser": "^7.13.14",
     "@babel/polyfill": "^7.10.4",
     "@vue/cli-plugin-babel": "^4.4.0",
     "@vue/cli-plugin-eslint": "^4.4.0",
     "@vue/cli-plugin-unit-jest": "^4.4.0",
     "@vue/cli-service": "^4.4.0",
     "@vue/eslint-config-prettier": "^6.0.0",
     "@vue/test-utils": "^1.0.3",
-    "babel-eslint": "^10.1.0",
     "eslint": "^6.7.2",
-    "eslint-plugin-prettier": "^3.1.3",
+    "eslint-plugin-prettier": "^3.3.1",
     "eslint-plugin-vue": "^6.2.2",
+    "jest-fetch-mock": "^3.0.3",
     "prettier": "^1.19.1",
     "vue": "^2.6.12",
     "vue-template-compiler": "^2.6.12"

src/App.vue

@@ -23,6 +23,7 @@ import DesignSystem from 'owncloud-design-system'
 import initVueAuthenticate from './services/auth'
 import FilePicker from './components/FilePicker.vue'
 import Login from './components/Login.vue'
+import { loadConfig } from './helpers/config'
 
 // Init sdk and design system
 /* global Vue */
@@ -58,7 +59,7 @@ export default {
       default: null
     },
     configObject: {
-      type: Object,
+      type: [Object, String],
       required: false,
       default: null
     },
@@ -104,13 +105,7 @@ export default {
     },
 
     async initAuthentication() {
-      // If configObject is passed - use that one instead of fetching one
-      if (this.configObject !== null) {
-        this.config = this.configObject
-      } else {
-        let config = await fetch(this.configLocation)
-        this.config = await config.json()
-      }
+      this.config = await loadConfig(this.configObject, this.configLocation)
 
       if (this.bearerToken) {
         return this.initApp()

src/helpers/config.js

@@ -0,0 +1,20 @@
+/**
+ * Identify which way of configuring the file picker was chosen and return a config object from it,
+ * either by fetching, parsing or plain returning it.
+ *
+ * @param configObject object|string|null Either an object or a json string holding the config
+ * @param configLocation string A config url
+ * @returns {Promise<any>}
+ */
+export async function loadConfig(configObject, configLocation) {
+  if (configObject === null) {
+    const config = await fetch(configLocation)
+    return await config.json()
+  }
+
+  if (typeof configObject === 'string') {
+    return JSON.parse(configObject)
+  }
+
+  return configObject
+}

tests/unit/__snapshots__/filePicker.spec.js.snap

@@ -28,7 +28,7 @@ exports[`File picker renders list of resources 1`] = `
                 </div>
                 <div class="uk-text-meta">
                   0 B - Last modified
-                  11 hours ago
+                  16 hours ago
                 </div>
               </div>
             </div>
@@ -49,7 +49,7 @@ exports[`File picker renders list of resources 1`] = `
                 </div>
                 <div class="uk-text-meta">
                   1.3 MB - Last modified
-                  11 hours ago
+                  16 hours ago
                 </div>
               </div>
             </div>
@@ -68,7 +68,7 @@ exports[`File picker renders list of resources 1`] = `
                 <div filename="ownCloud Manual.pdf" class="file-row-name uk-text-truncate"><span role="button" class="uk-text-bold oc-cursor-pointer oc-file-name uk-padding-remove-left">ownCloud Manual</span><span class="uk-text-meta oc-file-extension">.pdf</span></div>
                 <div class="uk-text-meta">
                   5.8 MB - Last modified
-                  11 hours ago
+                  16 hours ago
                 </div>
               </div>
             </div>

tests/unit/config/jest.init.js

@@ -0,0 +1,2 @@
+import fetchMock from 'jest-fetch-mock'
+fetchMock.enableMocks()

tests/unit/helpers/config.spec.js

@@ -0,0 +1,28 @@
+import { loadConfig } from '@/helpers/config'
+
+const exampleConfig = {
+  server: 'https://own.cloud/',
+  auth: {
+    clientId: 'rWgSlOtLJCO6QBtEVgDdXWlUOrEt2CBL9F48c6TQKt3ZGG5ofazNhEJjp6TlyanT',
+    url: 'https://own.cloud/index.php/apps/oauth2/api/v1/token',
+    authUrl: 'https://own.cloud/index.php/apps/oauth2/authorize'
+  }
+}
+
+describe('FilePicker config', () => {
+  describe('loadConfig', () => {
+    it('When no configObject is provided, then the config is fetched from the configLocation', async () => {
+      fetch.mockResponseOnce(JSON.stringify(exampleConfig))
+      const config = await loadConfig(null, 'https://whatever.location/config.json')
+      expect(config).toEqual(exampleConfig)
+    })
+    it('When a configObject is provided and of type string, it is parsed as JSON', async () => {
+      const config = await loadConfig(JSON.stringify(exampleConfig), null)
+      expect(config).toEqual(exampleConfig)
+    })
+    it('When a configObject is provided and not of type string, it is returned without modification', async () => {
+      const config = await loadConfig(exampleConfig, null)
+      expect(config).toEqual(exampleConfig)
+    })
+  })
+})