release: [email protected] (#1986)

* build(miniapp-render): publish version 1.2.2 * fix(miniapp): not distinguish event between alipay and wechat * fix: page render * chore: opitimize code * feat: init * fix: first render opportunity * docs(miniapp): add multiple demos * fix: first render callback * refactor(miniapp): rename behavior * chore(example): resolve conflict * chore(miniapp): , remove inside build-plugin * chore(example): remove console.log Co-authored-by: fushen <[email protected]>
alibaba · Aug 20, 2020 · 247459e · 247459e
1 parent a67b75c
commit 247459e
Show file tree

Hide file tree

Showing 32 changed files with 123 additions and 186 deletions.
diff --git a/examples/app-lifecycle/build.json b/examples/app-lifecycle/build.json
@@ -15,7 +15,6 @@
           "buildType": "runtime"
         }
       }
-    ],
-    "@ali/build-plugin-rax-app-def"
+    ]
   ]
 }
diff --git a/examples/app-lifecycle/package.json b/examples/app-lifecycle/package.json
@@ -26,8 +26,7 @@
     "eslint-config-rax": "^0.1.0",
     "eslint-plugin-import": "^2.20.0",
     "eslint-plugin-module": "^0.1.0",
-    "eslint-plugin-react": "^7.18.0",
-    "@ali/build-plugin-rax-app-def": "^1.0.2"
+    "eslint-plugin-react": "^7.18.0"
   },
   "private": true,
   "originTemplate": "@rax-materials/scaffolds-app-js"

diff --git a/examples/page-lifecycle-with-router/build.json b/examples/page-lifecycle-with-router/build.json
@@ -15,7 +15,6 @@
           "buildType": "runtime"
         }
       }
-    ],
-    "@ali/build-plugin-rax-app-def"
+    ]
   ]
 }
diff --git a/examples/page-lifecycle-with-router/package.json b/examples/page-lifecycle-with-router/package.json
@@ -26,8 +26,7 @@
     "eslint-config-rax": "^0.1.0",
     "eslint-plugin-import": "^2.20.0",
     "eslint-plugin-module": "^0.1.0",
-    "eslint-plugin-react": "^7.18.0",
-    "@ali/build-plugin-rax-app-def": "^1.0.2"
+    "eslint-plugin-react": "^7.18.0"
   },
   "private": true,
   "originTemplate": "@rax-materials/scaffolds-app-js"

diff --git a/examples/use-rax-compiled-component-in-runtime-miniapp/build.json b/examples/use-rax-compiled-component-in-runtime-miniapp/build.json
@@ -14,7 +14,6 @@
           "buildType": "runtime"
         }
       }
-    ],
-    "@ali/build-plugin-rax-app-def"
+    ]
   ]
 }
diff --git a/examples/use-rax-compiled-component-in-runtime-miniapp/package.json b/examples/use-rax-compiled-component-in-runtime-miniapp/package.json
@@ -27,8 +27,7 @@
     "eslint-config-rax": "^0.1.0",
     "eslint-plugin-import": "^2.20.0",
     "eslint-plugin-module": "^0.1.0",
-    "eslint-plugin-react": "^7.18.0",
-    "@ali/build-plugin-rax-app-def": "^1.0.2"
+    "eslint-plugin-react": "^7.18.0"
   },
   "private": true,
   "originTemplate": "@rax-materials/scaffolds-app-js"

diff --git a/examples/with-miniapp-native-custom-component/build.json b/examples/with-miniapp-native-custom-component/build.json
@@ -15,7 +15,6 @@
           "buildType": "runtime"
         }
       }
-    ],
-    "@ali/build-plugin-rax-app-def"
+    ]
   ]
 }
diff --git a/examples/with-miniapp-native-custom-component/package.json b/examples/with-miniapp-native-custom-component/package.json
@@ -27,8 +27,7 @@
     "eslint-config-rax": "^0.1.0",
     "eslint-plugin-import": "^2.20.0",
     "eslint-plugin-module": "^0.1.0",
-    "eslint-plugin-react": "^7.18.0",
-    "@ali/build-plugin-rax-app-def": "^1.0.2"
+    "eslint-plugin-react": "^7.18.0"
   },
   "private": true,
   "originTemplate": "@rax-materials/scaffolds-app-js"

diff --git a/examples/with-miniapp-native-page/build.json b/examples/with-miniapp-native-page/build.json
@@ -14,7 +14,6 @@
           "buildType": "runtime"
         }
       }
-    ],
-    "@ali/build-plugin-rax-app-def"
+    ]
   ]
 }
diff --git a/examples/with-miniapp-native-page/package.json b/examples/with-miniapp-native-page/package.json
@@ -26,8 +26,7 @@
     "eslint-config-rax": "^0.1.0",
     "eslint-plugin-import": "^2.20.0",
     "eslint-plugin-module": "^0.1.0",
-    "eslint-plugin-react": "^7.18.0",
-    "@ali/build-plugin-rax-app-def": "^1.0.2"
+    "eslint-plugin-react": "^7.18.0"
   },
   "private": true,
   "originTemplate": "@rax-materials/scaffolds-app-js"

diff --git a/examples/with-miniapp-plugin-component/ali-miniapp-plugin/components/test/index.js b/examples/with-miniapp-plugin-component/ali-miniapp-plugin/components/test/index.js
@@ -1,6 +1,6 @@
 Component({
   props: {
-    pluginName: ''
+    pluginName: 'plugin'
   },
   methods: {
     onClick() {

diff --git a/examples/with-miniapp-plugin-component/ali-miniapp-plugin/pages/index/index.js b/examples/with-miniapp-plugin-component/ali-miniapp-plugin/pages/index/index.js
@@ -1 +1 @@
-Page({});
+Page({});
diff --git a/examples/with-miniapp-plugin-component/build.json b/examples/with-miniapp-plugin-component/build.json
@@ -15,7 +15,6 @@
           "buildType": "runtime"
         }
       }
-    ],
-    "@ali/build-plugin-rax-app-def"
+    ]
   ]
 }
diff --git a/examples/with-miniapp-plugin-component/package.json b/examples/with-miniapp-plugin-component/package.json
@@ -26,8 +26,7 @@
     "eslint-config-rax": "^0.1.0",
     "eslint-plugin-import": "^2.20.0",
     "eslint-plugin-module": "^0.1.0",
-    "eslint-plugin-react": "^7.18.0",
-    "@ali/build-plugin-rax-app-def": "^1.0.2"
+    "eslint-plugin-react": "^7.18.0"
   },
   "private": true,
   "originTemplate": "@rax-materials/scaffolds-app-js"

diff --git a/examples/with-miniapp-plugin-component/wechat-miniprogram-plugin/index.js b/examples/with-miniapp-plugin-component/wechat-miniprogram-plugin/index.js
@@ -3,4 +3,4 @@ module.exports = {
     console.log('Hello plugin!');
   },
   answer: 42
-};
+};
diff --git a/examples/with-miniapp-plugin-component/wechat-miniprogram-plugin/pages/hello-page.js b/examples/with-miniapp-plugin-component/wechat-miniprogram-plugin/pages/hello-page.js
@@ -63,4 +63,4 @@ Page({
   onShareAppMessage: function() {
 
   }
-});
+});
diff --git a/packages/miniapp-render/package.json b/packages/miniapp-render/package.json
@@ -1,6 +1,6 @@
 {
   "name": "miniapp-render",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "description": "DOM simulator for MiniApp",
   "files": [
     "dist"

diff --git a/packages/miniapp-render/src/bridge/createEventProxy.js b/packages/miniapp-render/src/bridge/createEventProxy.js
@@ -19,7 +19,7 @@ function getPageId(internal, pageId) {
   return props && props.r.pageId;
 }
 
-export default function(pageId) {
+export default function() {
   const config = {};
   // Add get DOM Node from event method
   config.getDomNodeFromEvt = getDomNodeFromEvt;
@@ -32,7 +32,7 @@ export default function(pageId) {
   // Add reactive event define which will bubble
   baseEvents.forEach(({ name, extra = null, eventName }) => {
     config[name] = function(evt) {
-      const __pageId = getPageId(this, pageId);
+      const __pageId = getPageId(this, this.data.pageId);
       const document = cache.getDocument(__pageId);
       if (document && document.__checkEvent(evt)) {
         const nodeId = evt.currentTarget.dataset.privateNodeId;
@@ -43,7 +43,7 @@ export default function(pageId) {
   // Add reactive event define which won't bubble
   handlesMap.simpleEvents.forEach(({ name, eventName }) => {
     config[name] = function(evt) {
-      const __pageId = getPageId(this, pageId);
+      const __pageId = getPageId(this, this.data.pageId);
       const nodeId = evt.currentTarget.dataset.privateNodeId;
       const targetNode = cache.getNode(__pageId, nodeId);
       if (!targetNode) return;
@@ -54,15 +54,15 @@ export default function(pageId) {
   // Add reactive event define which only trigger once
   handlesMap.singleEvents.forEach(({ name, eventName }) => {
     config[name] = function(evt) {
-      const __pageId = getPageId(this, pageId);
+      const __pageId = getPageId(this, this.data.pageId);
       this.callSingleEvent(eventName, evt, __pageId);
     };
   });
 
   // Add reactive event define which only trigger once and need middleware
   handlesMap.functionalSingleEvents.forEach(({ name, eventName, middleware }) => {
     config[name] = function(evt) {
-      const __pageId = getPageId(this, pageId);
+      const __pageId = getPageId(this, this.data.pageId);
       const domNode = this.getDomNodeFromEvt(eventName, evt, __pageId);
       if (!domNode) return;
       middleware.call(this, evt, domNode);
@@ -73,7 +73,7 @@ export default function(pageId) {
   // Add reactive event define which complex
   handlesMap.complexEvents.forEach(({ name, eventName, middleware }) => {
     config[name] = function(evt) {
-      const __pageId = getPageId(this, pageId);
+      const __pageId = getPageId(this, this.data.pageId);
       const domNode = this.getDomNodeFromEvt(eventName, evt, __pageId);
       if (!domNode) return;
       middleware.call(this, evt, domNode, __pageId, evt.currentTarget.dataset.privateNodeId);

diff --git a/packages/miniapp-render/src/bridge/events/callEvent.js b/packages/miniapp-render/src/bridge/events/callEvent.js
@@ -34,7 +34,7 @@ export default function(eventName, evt, extra, pageId, nodeId) {
 
               if (!targetDomNode)
                 targetDomNode = domNode.querySelector(
-                  'builtIn-component[behavior=switch]'
+                  'builtIn-component[_behavior=switch]'
                 );
             }
 
@@ -47,7 +47,7 @@ export default function(eventName, evt, extra, pageId, nodeId) {
             } else if (targetDomNode.tagName === 'BUILTIN-COMPONENT') {
               if (checkEventAccessDomNode(evt, targetDomNode, domNode)) return;
 
-              const behavior = targetDomNode.behavior;
+              const behavior = targetDomNode._behavior;
               if (behavior === 'switch') {
                 const checked = !targetDomNode.getAttribute('checked');
                 targetDomNode.setAttribute('checked', checked);
@@ -61,7 +61,7 @@ export default function(eventName, evt, extra, pageId, nodeId) {
           } else if (
             (domNode.tagName === 'BUTTON' ||
               domNode.tagName === 'BUILTIN-COMPONENT' &&
-                domNode.behavior === 'button') &&
+                domNode._behavior === 'button') &&
             evt.type === 'click' &&
             !isCapture
           ) {
@@ -84,13 +84,13 @@ export default function(eventName, evt, extra, pageId, nodeId) {
               'textarea[name]'
             );
             const switchList = form
-              .querySelectorAll('builtin-component[behavior=switch]')
+              .querySelectorAll('builtin-component[_behavior=switch]')
               .filter((item) => !!item.getAttribute('name'));
             const sliderList = form
-              .querySelectorAll('builtin-component[behavior=slider]')
+              .querySelectorAll('builtin-component[_behavior=slider]')
               .filter((item) => !!item.getAttribute('name'));
             const pickerList = form
-              .querySelectorAll('builtin-component[behavior=picker]')
+              .querySelectorAll('builtin-component[_behavior=picker]')
               .filter((item) => !!item.getAttribute('name'));
 
             if (type === 'submit') {

diff --git a/packages/miniapp-render/src/builtInComponents/swiper.js b/packages/miniapp-render/src/builtInComponents/swiper.js
@@ -1,4 +1,7 @@
-export default {
+// eslint-disable-next-line import/no-extraneous-dependencies
+import { isMiniApp, isWeChatMiniProgram } from 'universal-env';
+
+const swiper = {
   name: 'swiper',
   props: [{
     name: 'indicator-dots',
@@ -82,10 +85,6 @@ export default {
   singleEvents: [{
     name: 'onSwiperTransition',
     eventName: 'transition'
-  },
-  {
-    name: 'onSwiperAnimationfinish',
-    eventName: 'animationfinish'
   }],
   functionalSingleEvents: [
     {
@@ -97,3 +96,18 @@ export default {
     }
   ]
 };
+
+if (isMiniApp) {
+  swiper.singleEvents.push({
+    name: 'onSwiperAnimationEnd',
+    eventName: 'animationEnd'
+  });
+}
+if (isWeChatMiniProgram) {
+  swiper.singleEvents.push({
+    name: 'onSwiperAnimationFinish',
+    eventName: 'animationfinish'
+  });
+}
+
+export default swiper;
diff --git a/packages/miniapp-render/src/createConfig/app.js b/packages/miniapp-render/src/createConfig/app.js
@@ -7,7 +7,7 @@ import cache from '../utils/cache';
 export default function(init, config) {
   cache.setConfig(config);
   const appConfig = {
-    launched: false,
+    launched: isMiniApp,
     onLaunch(options) {
       const window = createWindow();
       cache.setWindow(window);
@@ -16,9 +16,9 @@ export default function(init, config) {
       if (isMiniApp) {
         // Use page route as pageId key word
         // eslint-disable-next-line no-undef
-        const currentPageId = `${getCurrentPages()[0].route}-0`;
+        const currentPageId = `${getCurrentPages()[0].route}-1`;
         const currentDocument = createDocument(currentPageId);
-        window.__pageId = currentPageId;
+        this.__pageId = window.__pageId = currentPageId;
 
         init(window, currentDocument);
         window.$$trigger('launch', {
@@ -41,7 +41,8 @@ export default function(init, config) {
       this.window = window;
     },
     onShow(options) {
-      if (this.window) {
+      if (this.window && this.launched) {
+        this.__showOptions = options;
         this.window.$$trigger('appshow', {
           event: {
             options,
-Original file line number
+Diff line change
@@ Expand Up / @@ -15,7 +15,6 @@ @@
               "buildType": "runtime"
             }
           }
-        ],
-        "@ali/build-plugin-rax-app-def"
+        ]
       ]
     }