Breaking: Updating component to use stable AMF data model.

arc-archive · Jun 27, 2018 · 42405f9 · 42405f9
1 parent 2a7bdf1
commit 42405f9
Show file tree

Hide file tree

Showing 9 changed files with 16,440 additions and 14,857 deletions.
diff --git a/analysis.json b/analysis.json
diff --git a/api-request-editor.html b/api-request-editor.html
@@ -157,7 +157,7 @@
         <authorization-panel events-target="[[eventsTarget]]" hidden$="[[authNotRequired]]" secured-by="[[securedBy]]" redirect-uri="[[redirectUri]]" auth-required="{{authRequired}}" auth-valid="{{authValid}}"></authorization-panel>
         <api-url-params-editor uri-model="{{pathModel}}" query-model="{{queryModel}}" narrow="[[narrow]]" allow-custom="[[allowCustom]]" invalid="{{paramsInvalid}}"></api-url-params-editor>
         <api-headers-editor events-target="[[eventsTarget]]" amf-headers="[[apiHeaders]]" narrow="[[narrow]]" content-type="{{contentType}}" is-payload="[[isPayloadRequest]]" value="{{headers}}" narrow="[[narrow]]" allow-custom="[[allowCustom]]" allow-disable-params="[[allowDisableParams]]" allow-hide-optional="[[allowHideOptional]]" invalid="{{headersInvalid}}"></api-headers-editor>
-        <api-body-editor events-target="[[eventsTarget]]" amf-model="[[apiPayload]]" narrow="[[narrow]]" hidden$="[[!isPayloadRequest]]" content-type="{{contentType}}" value="{{payload}}" narrow="[[narrow]]" allow-custom="[[allowCustom]]" allow-disable-params="[[allowDisableParams]]" allow-hide-optional="[[allowHideOptional]]"></api-body-editor>
+        <api-body-editor events-target="[[eventsTarget]]" amf-model="[[amfModel]]" amf-body="[[apiPayload]]" narrow="[[narrow]]" hidden$="[[!isPayloadRequest]]" content-type="{{contentType}}" value="{{payload}}" narrow="[[narrow]]" allow-custom="[[allowCustom]]" allow-disable-params="[[allowDisableParams]]" allow-hide-optional="[[allowHideOptional]]"></api-body-editor>
       </iron-pages>
       <div class="action-bar">
         <paper-spinner alt="Loading contacts list" active="[[loadingRequest]]"></paper-spinner>
@@ -180,9 +180,6 @@
   </template>
   <script>
   (function() {
-    const RAML_VOC = 'http://raml.org/vocabularies/';
-    const VOC_HTTP = RAML_VOC + 'http#';
-    const HYD_CORE = 'http://www.w3.org/ns/hydra/core#';
     /**
      * `api-request-editor`
      * A request editor that builds the UI based on [AMF](https://github.com/mulesoft/amf/) model.
@@ -623,7 +620,7 @@
         if (endpointId === id) {
           return;
         }
-        return this.findMethod(id, endpoint[HYD_CORE + 'supportedOperation']);
+        return this.findMethod(id, endpoint[this.ns.w3.hydra.core + 'supportedOperation']);
       }
       /**
        * Computes endpoint `@id` for given `id`.
@@ -658,7 +655,7 @@
         if (!webApi) {
           return;
         }
-        const endpoints = webApi[VOC_HTTP + 'endpoint'];
+        const endpoints = webApi[this.ns.raml.vocabularies.http + 'endpoint'];
         if (!endpoints) {
           return;
         }
@@ -684,7 +681,7 @@
        * @return {Array|undefined} List of security definitions for the endpoint.
        */
       _computeSecuredBy(model) {
-        return model && model[RAML_VOC + 'security#security'];
+        return model && model[this.ns.raml.vocabularies.security + 'security'];
       }
       /**
        * Computes model definition for headers.
@@ -696,12 +693,12 @@
         if (!model) {
           return;
         }
-        model = model[HYD_CORE + 'expects'];
+        model = model[this.ns.w3.hydra.core + 'expects'];
         if (!model) {
           return;
         }
         model = model[0];
-        return model[VOC_HTTP + 'header'];
+        return model[this.ns.raml.vocabularies.http + 'header'];
       }
       /**
        * Computes if authorization for the endpoint is set.
@@ -720,7 +717,7 @@
        * @return {String} Method name.
        */
       _computeHttpMethod(model) {
-        return this._getValue(model, HYD_CORE + 'method');
+        return this._getValue(model, this.ns.w3.hydra.core + 'method');
       }
       /**
        * Computes value for `apiPayload` property from AMF model for current
@@ -733,12 +730,12 @@
         if (!model) {
           return;
         }
-        model = model[HYD_CORE + 'expects'];
+        model = model[this.ns.w3.hydra.core + 'expects'];
         if (!model) {
           return;
         }
         model = model[0];
-        return model[VOC_HTTP + 'payload'];
+        return model[this.ns.raml.vocabularies.http + 'payload'];
       }
       /**
        * Computes value for `isPayloadRequest`.

diff --git a/bower.json b/bower.json
@@ -1,7 +1,7 @@
 {
   "name": "api-request-editor",
   "description": "A request editor that builds the UI based on AMF model",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "license": "Apache-2.0",
   "main": "api-request-editor.html",
   "authors": [

diff --git a/demo/amf-model.json b/demo/amf-model.json
diff --git a/demo/index.html b/demo/index.html
@@ -96,7 +96,6 @@
           <paper-checkbox checked="{{allowHideOptional}}">Allow auto hide optional headers</paper-checkbox>
           <paper-checkbox checked="{{allowDisableParams}}">Allow disabling parameters</paper-checkbox>
           <paper-input label="Override base uri" value="{{baseUri}}"></paper-input>
-
         </section>
         <paper-toast text="Request send event detected" id="rsend"></paper-toast>
         <paper-toast text="Request abort event detected" id="rabort"></paper-toast>
@@ -131,8 +130,8 @@
         return model[0]['@value'];
       };
       app._setEndpointsList = function(data) {
-        data = data[0]['http://raml.org/vocabularies/document#encodes'][0];
-        const endpoints = data['http://raml.org/vocabularies/http#endpoint'];
+        data = data[0][ApiElements.Amf.ns.raml.vocabularies.document + 'encodes'][0];
+        const endpoints = data[ApiElements.Amf.ns.raml.vocabularies.http + 'endpoint'];
 
         const selector = document.createElement('paper-dropdown-menu');
         selector.label = 'Select demo endpoint';
@@ -142,7 +141,7 @@
 
         const labels = [];
         endpoints.forEach((item) => {
-          const label = app._getAmfValue(item['http://raml.org/vocabularies/http#path']);
+          const label = app._getAmfValue(item[ApiElements.Amf.ns.raml.vocabularies.http + 'path']);
           labels.push(label);
           const pItem = document.createElement('paper-item');
           pItem.innerText = label;
@@ -168,9 +167,9 @@
       };
       app._computeOperations = function(index) {
         app._clearOperations();
-        let data = app.amfModel[0]['http://raml.org/vocabularies/document#encodes'][0];
-        data = data['http://raml.org/vocabularies/http#endpoint'][index];
-        const operations = data['http://www.w3.org/ns/hydra/core#supportedOperation'];
+        let data = app.amfModel[0][ApiElements.Amf.ns.raml.vocabularies.document + 'encodes'][0];
+        data = data[ApiElements.Amf.ns.raml.vocabularies.http + 'endpoint'][index];
+        const operations = data[ApiElements.Amf.ns.w3.hydra.core + 'supportedOperation'];
         if (!operations) {
           return;
         }
@@ -182,7 +181,7 @@
         list.addEventListener('selected-changed', app._methodChanged);
         const items = [];
         operations.forEach((item) => {
-          const label = app._getAmfValue(item['http://www.w3.org/ns/hydra/core#method']);
+          const label = app._getAmfValue(item[ApiElements.Amf.ns.w3.hydra.core + 'method']);
           items.push({
             id: item['@id'],
             label: label

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@api-components/api-request-editor",
   "description": "A request editor that builds the UI based on AMF model",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "license": "Apache-2.0",
   "main": "api-request-editor.html",
   "authors": [
@@ -10,7 +10,7 @@
   ],
   "devDependencies": {
     "@polymer/gen-typescript-declarations": "^1.1.1",
-    "amf-client-js": "^1.4.0-31",
+    "amf-client-js": "^1.5.0",
     "fs-extra": "^5.0.0"
   },
   "private": false,

diff --git a/test/amf-loader.js b/test/amf-loader.js
@@ -13,10 +13,6 @@ AmfLoader.load = function() {
         reject(e);
         return;
       }
-      // data = data[0]['http://raml.org/vocabularies/document#encodes'][0];
-      // data = data['http://raml.org/vocabularies/http#endpoint'][endpointIndex];
-      // data = data['http://www.w3.org/ns/hydra/core#supportedOperation'][method];
-      // data = data['http://raml.org/vocabularies/security#security'];
       resolve(data);
     });
     xhr.addEventListener('error',

diff --git a/test/api-request-editor_test.html b/test/api-request-editor_test.html
@@ -77,17 +77,17 @@
       test('Returns undefined when not a Document', () => {
         const id = API_ROOT + '%2Fpeople';
         const result = element.findEndpoint(id, {
-          '@type': ['http://raml.org/vocabularies/document#Unit']
+          '@type': ['http://a.ml/vocabularies/document#Unit']
         });
         assert.isUndefined(result);
       });
 
       test('Returns undefined when no WebApi', () => {
         const id = API_ROOT + '%2Fpeople';
         const result = element.findEndpoint(id, {
-          '@type': ['http://raml.org/vocabularies/document#Document'],
-          'http://raml.org/vocabularies/document#encodes': [{
-            '@type': ['http://raml.org/vocabularies/document#DomainElement']
+          '@type': ['http://a.ml/vocabularies/document#Document'],
+          'http://a.ml/vocabularies/document#encodes': [{
+            '@type': ['http://a.ml/vocabularies/document#DomainElement']
           }]
         });
         assert.isUndefined(result);