@tarojs/helper 3.8.0-canary.0 → 4.0.0-beta.0

package/swc/plugin-compile-mode/src/tests/harmony/mod.rs

@@ -0,0 +1,45 @@
+pub use super::get_syntax_config;
+use swc_core::ecma::visit::{as_folder, Fold, VisitMut};
+use crate::{
+  PluginConfig,
+  transform_harmony::*,
+};
+
+mod entry;
+mod attributes;
+mod condition;
+mod looping;
+mod children;
+
+pub fn tr () -> impl Fold + VisitMut {
+  let config = serde_json::from_str::<PluginConfig>(
+      r#"
+      {
+          "is_harmony": true,
+          "tmpl_prefix": "f0",
+          "support_events": [
+            "onLoad",
+            "onClick",
+            "onTouchEnd",
+            "onTouchMove",
+            "onTouchStart",
+            "onTouchCancel"
+          ],
+          "support_components": [
+            "view",
+            "text",
+            "image"
+          ],
+          "event_adapter": {
+            "onTouchEnd": "onTouch",
+            "onTouchMove": "onTouch",
+            "onTouchStart": "onTouch",
+            "onTouchCancel": "onTouch",
+            "onLoad": "onComplete"
+          }
+      }"#
+  )
+  .unwrap();
+  let visitor = TransformVisitor::new(config);
+  as_folder(visitor)
+}

package/swc/plugin-compile-mode/src/tests/looping.rs

@@ -22,21 +22,6 @@ test!(
           </View>
         )
     }
-    "#,
-    r#"
-    const TARO_TEMPLATES_f0t0 = '<template name="tmpl_0_f0t0"><view><view hover-class="{{xs.b(item.p1,\'none\')}}" wx:for="{{i.cn}}" wx:key="sid"><text>index:</text><text>{{item.cn[0].cn[0].v}}</text><text>item:</text><text>{{item.cn[1].cn[0].v}}</text></view></view></template>';
-    function Index () {
-        return <View compileMode="f0t0">
-            {list.map(function(item, index) {
-              return <View hoverClass={myClass}>
-                  
-                  <Text>{index}</Text>
-                  
-                  <Text>{item}</Text>
-                </View>
-            })}
-          </View>
-    }
     "#
 );
 
@@ -54,16 +39,6 @@ test!(
           </View>
         )
     }
-    "#,
-    r#"
-    const TARO_TEMPLATES_f0t0 = '<template name="tmpl_0_f0t0"><view><view wx:for="{{i.cn}}" wx:key="sid">{{item.cn[0].v}}</view></view></template>';
-    function Index () {
-        return <View compileMode="f0t0">
-            {list.map(item => {
-              return <View>{item}</View>
-            })}
-          </View>
-    }
     "#
 );
 
@@ -79,14 +54,6 @@ test!(
           </View>
         )
     }
-    "#,
-    r#"
-    const TARO_TEMPLATES_f0t0 = '<template name="tmpl_0_f0t0"><view><view wx:for="{{i.cn}}" wx:key="sid">{{item.cn[0].v}}</view></view></template>';
-    function Index () {
-        return <View compileMode="f0t0">
-            {list.map(item => <View>{item}</View>)}
-          </View>
-    }
     "#
 );
 
@@ -113,22 +80,5 @@ test!(
           </View>
         )
     }
-    "#,
-    r#"
-    const TARO_TEMPLATES_f0t0 = '<template name="tmpl_0_f0t0"><view><view hover-class="{{xs.b(item.p1,\'none\')}}" wx:for="{{i.cn}}" wx:key="sid"><view>title: {{item.cn[0].cn[0].v}}</view><view><text selectable="{{xs.b(item.p1,!1)}}" wx:for="{{item.cn[1].cn}}" wx:key="sid">content: {{item.cn[0].v}}</text></view></view></view></template>';
-    function Index () {
-        return <View compileMode="f0t0">
-            {list.map(function(item, index) {
-              return <View hoverClass={myClass} key={index}>
-                  <View>{item}</View>
-                  <View>
-                    {sublist.map(function(c) {
-                      return <Text selectable={isSelectable}>{c}</Text>
-                    })}
-                  </View>
-                </View>
-            })}
-          </View>
-    }
     "#
-);
+);

package/swc/plugin-compile-mode/src/tests/mod.rs

@@ -1,19 +1,21 @@
-mod entry;
-mod attributes;
-mod shake;
-mod condition;
-mod looping;
-
 use swc_core::ecma::{
     parser,
-    visit::{as_folder, Fold, VisitMut},
+    visit::{as_folder, Fold},
 };
 use crate::{
     PluginConfig,
     transform::*,
 };
 
-pub fn tr () -> impl Fold + VisitMut {
+mod entry;
+mod attributes;
+mod shake;
+mod condition;
+mod looping;
+mod children;
+mod harmony;
+
+pub fn tr () -> impl Fold {
     let config = serde_json::from_str::<PluginConfig>(
         r#"
         {
@@ -95,4 +97,4 @@ pub fn get_syntax_config () -> parser::Syntax {
         jsx: true,
         ..Default::default()
     })
-}
+}

package/swc/plugin-compile-mode/src/tests/shake.rs

@@ -23,19 +23,5 @@ test!(
           </View>
         )
     }
-    "#,
-    r#"
-    const TARO_TEMPLATES_f0t0 = '<template name="tmpl_0_f0t0"><view><text>Hello World!</text><text>Hello{{i.cn[0].cn[0].v}}World{{i.cn[0].cn[1].v}}!</text><view><text></text></view><view hover-stop-propagation="true" style="color: red"><text>Hello World!</text></view><view style="{{i.cn[1].st}}"><text>Hello World!</text></view></view></template>';
-    function Index () {
-        return <View compileMode="f0t0">
-            
-            <Text>{T1}{T2}</Text>
-            
-            
-            <View style={myStyle}>
-                
-            </View>
-          </View>
-    }
     "#
-);
+);

package/swc/plugin-compile-mode/src/transform.rs

@@ -3,124 +3,131 @@ use swc_core::{
     common::{
         iter::IdentifyLast,
         util::take::Take,
-        DUMMY_SP as span
+        DUMMY_SP as span,
     },
     ecma::{
         self,
         ast::*,
-        atoms::Atom,
         visit::{VisitMut, VisitMutWith},
+        utils::{quote_ident, quote_str},
     },
+    atoms::Atom,
 };
 use std::collections::HashMap;
-use std::rc::Rc;
 use crate::PluginConfig;
 use crate::utils::{self, constants::*};
 
 struct PreVisitor {
-    is_in_jsx_expr_container: Rc<bool>,
     is_in_and_expr: bool,
 }
 impl PreVisitor {
     fn new () -> Self {
         Self {
-            is_in_jsx_expr_container: Rc::new(true),
             is_in_and_expr: false
         }
     }
 }
 impl VisitMut for PreVisitor {
-    fn visit_mut_jsx_expr_container (&mut self, container: &mut JSXExprContainer) {
-        let _counter = Rc::clone(&self.is_in_jsx_expr_container);
-        // TODO 目前的判断可能误伤函数内的三元表达式、条件表达式
-        container.visit_mut_children_with(self);
-    }
-    fn visit_mut_expr (&mut self, expr: &mut Expr) {
-        if Rc::strong_count(&self.is_in_jsx_expr_container) == 1 { return };
-        let mut is_first_and_expr = false;
-        
-        match expr {
-            Expr::Bin(BinExpr { op, left, right, ..}) => {
-                // C&&A 替换为 C?A:A'，原因是为了无论显示还是隐藏都保留一个元素，从而不影响兄弟节点的变量路径
-                if *op == op!("&&") && !self.is_in_and_expr {
-                    is_first_and_expr = true;
-                    fn inject_compile_if (el: &mut Box<JSXElement>, condition: &mut Box<Expr>) -> () {
-                        el.opening.attrs.push(utils::create_jsx_expr_attr(COMPILE_IF, condition.clone()));
-                    }
-                    fn get_element_double (element_name: JSXElementName, condition: &mut Box<Expr>, right: &mut Box<Expr>) -> Expr {
-                        Expr::Cond(CondExpr {
-                            span,
-                            test: condition.take(),
-                            cons: right.take(),
-                            alt: Box::new(utils::create_self_closing_jsx_element_expr(
-                                element_name, // element 替换为同类型的元素。在显示/隐藏切换时，让运行时 diff 只更新必要属性而不是整个节点刷新
-                                Some(vec![utils::create_jsx_bool_attr(COMPILE_IGNORE)]
-                            )))
-                        })
-                    }
-                    match &mut **right {
-                        Expr::JSXElement(el) => {
-                            let element_name = el.opening.name.clone();
-                            inject_compile_if(el, left);
-                            *expr = get_element_double(element_name, left, right);
-                        },
-                        Expr::Paren(ParenExpr { expr: paren_expr, .. }) => {
-                            if paren_expr.is_jsx_element() {
-                                let el: &mut Box<JSXElement> = paren_expr.as_mut_jsx_element().unwrap();
-                                let element_name = el.opening.name.clone();
-                                inject_compile_if(el, left);
-                                *expr = get_element_double(element_name, left, paren_expr);
-                            }
-                        },
-                        Expr::Lit(_) => {
-                            *expr = Expr::Cond(CondExpr {
+    fn visit_mut_jsx_element_child (&mut self, child: &mut JSXElementChild) {
+        if let JSXElementChild::JSXExprContainer(JSXExprContainer { expr: JSXExpr::Expr(expr), .. }) = child {
+            let mut is_first_and_expr = false;
+
+            if let Expr::Paren(ParenExpr { expr: e, .. }) = &mut **expr {
+                *expr = e.take();
+            }
+
+            match &mut **expr {
+                Expr::Bin(BinExpr { op, left, right, ..}) => {
+                    // C&&A 替换为 C?A:A'，原因是为了无论显示还是隐藏都保留一个元素，从而不影响兄弟节点的变量路径
+                    if *op == op!("&&") && !self.is_in_and_expr {
+                        is_first_and_expr = true;
+                        fn inject_compile_if (el: &mut Box<JSXElement>, condition: &mut Box<Expr>) -> () {
+                            el.opening.attrs.push(utils::create_jsx_expr_attr(COMPILE_IF, condition.clone()));
+                        }
+                        fn get_element_double (element_name: JSXElementName, condition: &mut Box<Expr>, right: &mut Box<Expr>) -> Expr {
+                            Expr::Cond(CondExpr {
                                 span,
-                                test: left.take(),
+                                test: condition.take(),
                                 cons: right.take(),
-                                alt: Box::new(Expr::Lit(Lit::Str(Str { span, value: COMPILE_IGNORE.into(), raw: None })))
+                                alt: Box::new(utils::create_self_closing_jsx_element_expr(
+                                    element_name, // element 替换为同类型的元素。在显示/隐藏切换时，让运行时 diff 只更新必要属性而不是整个节点刷新
+                                    Some(vec![utils::create_jsx_bool_attr(COMPILE_IGNORE)]
+                                )))
                             })
-                        },
-                        _ => {
-                            // TODO Unknown fallback to template
-                            println!("unknown expr: {right:?}");
                         }
-                    }
-                }
-            },
-            Expr::Cond(CondExpr { test, cons, alt, ..}) => {
-                let compile_if = utils::create_jsx_expr_attr(COMPILE_IF, test.clone());
-                let compile_else = utils::create_jsx_bool_attr(COMPILE_ELSE);
-                let process_cond_arm = |arm: &mut Box<Expr>, attr: JSXAttrOrSpread| {
-                    match &mut **arm {
-                        Expr::JSXElement(el) => {
-                            el.opening.attrs.push(attr);
-                        },
-                        _ => {
-                            let temp = arm.take();
-                            let jsx_el_name = JSXElementName::Ident(Ident { span, sym: "block".into(), optional: false });
-                            **arm = Expr::JSXElement(Box::new(JSXElement {
-                                span,
-                                opening: JSXOpeningElement { name: jsx_el_name.clone(), span, attrs: vec![attr], self_closing: false, type_args: None },
-                                children: vec![JSXElementChild::JSXExprContainer(JSXExprContainer { span, expr: JSXExpr::Expr(temp)})],
-                                closing: Some(JSXClosingElement { span, name: jsx_el_name })
-                            }))
+                        match &mut **right {
+                            Expr::JSXElement(el) => {
+                                let element_name = el.opening.name.clone();
+                                inject_compile_if(el, left);
+                                **expr = get_element_double(element_name, left, right);
+                            },
+                            Expr::Paren(ParenExpr { expr: paren_expr, .. }) => {
+                                if paren_expr.is_jsx_element() {
+                                    let el: &mut Box<JSXElement> = paren_expr.as_mut_jsx_element().unwrap();
+                                    let element_name = el.opening.name.clone();
+                                    inject_compile_if(el, left);
+                                    **expr = get_element_double(element_name, left, paren_expr);
+                                }
+                            },
+                            Expr::Lit(_) => {
+                                **expr = Expr::Cond(CondExpr {
+                                    span,
+                                    test: left.take(),
+                                    cons: right.take(),
+                                    alt: Box::new(Expr::Lit(Lit::Str(quote_str!(COMPILE_IGNORE))))
+                                })
+                            },
+                            _ => {
+                                let jsx_el_name = JSXElementName::Ident(quote_ident!("block"));
+                                let mut block = Box::new(JSXElement {
+                                    span,
+                                    opening: JSXOpeningElement { name: jsx_el_name.clone(), span, attrs: vec![], self_closing: false, type_args: None },
+                                    children: vec![JSXElementChild::JSXExprContainer(JSXExprContainer { span, expr: JSXExpr::Expr(right.take()) })],
+                                    closing: Some(JSXClosingElement { span, name: jsx_el_name.clone() })
+                                });
+                                inject_compile_if(&mut block, left);
+                                **expr = get_element_double(jsx_el_name, left, &mut Box::new(Expr::JSXElement(block)));
+                            }
                         }
                     }
-                };
-                process_cond_arm(cons, compile_if);
-                process_cond_arm(alt, compile_else);
-            },
-            _ => (),
-        }
+                },
+                Expr::Cond(CondExpr { test, cons, alt, ..}) => {
+                    let compile_if = utils::create_jsx_expr_attr(COMPILE_IF, test.clone());
+                    let compile_else = utils::create_jsx_bool_attr(COMPILE_ELSE);
+                    let process_cond_arm = |arm: &mut Box<Expr>, attr: JSXAttrOrSpread| {
+                        match &mut **arm {
+                            Expr::JSXElement(el) => {
+                                el.opening.attrs.push(attr);
+                            },
+                            _ => {
+                                let temp = arm.take();
+                                let jsx_el_name = JSXElementName::Ident(quote_ident!("block"));
+                                **arm = Expr::JSXElement(Box::new(JSXElement {
+                                    span,
+                                    opening: JSXOpeningElement { name: jsx_el_name.clone(), span, attrs: vec![attr], self_closing: false, type_args: None },
+                                    children: vec![JSXElementChild::JSXExprContainer(JSXExprContainer { span, expr: JSXExpr::Expr(temp)})],
+                                    closing: Some(JSXClosingElement { span, name: jsx_el_name })
+                                }))
+                            }
+                        }
+                    };
+                    process_cond_arm(cons, compile_if);
+                    process_cond_arm(alt, compile_else);
+                },
+                _ => (),
+            }
 
-        if is_first_and_expr {
-            self.is_in_and_expr = true;
-        }
+            if is_first_and_expr {
+                self.is_in_and_expr = true;
+            }
 
-        expr.visit_mut_children_with(self);
+            expr.visit_mut_children_with(self);
 
-        if is_first_and_expr {
-            self.is_in_and_expr = false;
+            if is_first_and_expr {
+                self.is_in_and_expr = false;
+            }
+        } else {
+            child.visit_mut_children_with(self);
         }
     }
 }
@@ -151,13 +158,13 @@ impl TransformVisitor {
         let opening_element = &mut el.opening;
         match &opening_element.name {
             JSXElementName::Ident(ident) => {
-                let name = utils::to_kebab_case(&ident.sym);
+                let name = utils::to_kebab_case(ident.as_ref());
                 match self.config.components.get(&name) {
                     // 内置组件
                     Some(attrs_map) => {
                         let attrs = self.build_xml_attrs(opening_element, attrs_map);
                         if attrs.is_none() { return String::new() };
-                        let children = self.build_xml_children(el);
+                        let (children, ..) = self.build_xml_children(&mut el.children, None);
                         format!("<{}{}>{}</{}>", name, attrs.unwrap(), children, name)
                     },
                     None => {
@@ -180,8 +187,8 @@ impl TransformVisitor {
             if let JSXAttrOrSpread::JSXAttr(jsx_attr) = attr {
                 if let JSXAttrName::Ident(Ident { sym: name, .. }) = &jsx_attr.name {
                     let jsx_attr_name = name.to_string();
-                    
-                    if jsx_attr_name == "key" {
+
+                    if REACT_RESERVED.contains(&jsx_attr_name.as_str()) {
                         return true;
                     }
 
@@ -269,25 +276,24 @@ impl TransformVisitor {
         Some(attrs_string)
     }
 
-    fn build_xml_children (&mut self, el: &mut JSXElement) -> String {
+    fn build_xml_children (&mut self, children: &mut Vec<JSXElementChild>, retain_start_from: Option<i32>) -> (String, i32) {
         let mut children_string = String::new();
-        let mut retain_child_counter = 0;
+        let start = if retain_start_from.is_some() { retain_start_from.unwrap() } else { 0 };
+        let mut retain_child_counter = start;
 
-        el.children
-            .iter_mut()
-            .for_each(|child| {
+        children
+            .retain_mut(|child| {
+                let mut is_retain = true;
                 self.node_stack.push(retain_child_counter);
                 match child {
                     JSXElementChild::JSXElement(child_el) => {
                         let child_string = self.build_xml_element(&mut **child_el);
                         children_string.push_str(&child_string);
 
-                        let is_pure = utils::is_static_jsx(child_el);
-                        if is_pure {
-                            let raw: Atom = "To be removed".into();
-                            *child = JSXElementChild::JSXText(JSXText { span, value: raw.clone(), raw });
+                        if utils::is_static_jsx(child_el) && utils::is_inner_component(child_el, &self.config) {
+                            is_retain = false
                         } else {
-                            retain_child_counter = retain_child_counter + 1;
+                            retain_child_counter += 1;
                         }
                     },
                     JSXElementChild::JSXExprContainer(JSXExprContainer {
@@ -297,6 +303,7 @@ impl TransformVisitor {
                         if let Expr::Paren(ParenExpr { expr, .. }) = &mut **jsx_expr {
                             *jsx_expr = expr.take();
                         }
+                        let node_path = self.get_current_node_path();
                         match &mut **jsx_expr {
                             Expr::Cond(CondExpr { cons, alt, ..}) => {
                                 let mut process_condition_expr = |arm: &mut Box<Expr>| {
@@ -307,12 +314,14 @@ impl TransformVisitor {
                                         },
                                         Expr::Lit(lit) => {
                                             if let Lit::Str(Str { value, .. }) = lit {
-                                                if &*value == COMPILE_IGNORE {
+                                                if value == COMPILE_IGNORE {
                                                     return ();
                                                 }
                                             }
-                                            let current_path = self.get_current_node_path();
-                                            let str = format!(r#"{{{{{}.v==="{}"?"":{}.v}}}}"#, current_path, COMPILE_IGNORE, current_path);
+                                            // {condition1 && 'Hello'} 在预处理时会变成 {condition1 ? 'Hello' : "compileIgnore"}
+                                            // 而普通文本三元则会被 block 标签包裹，因此处理后只有上述情况会存在 lit 类型的表达式
+                                            // 由于这种情况没有办法使用 wx:if 来处理，需要特殊处理成 {{i.cn[3].v==="compileIgnore"?"":i.cn[3].v}} 的形式
+                                            let str = format!(r#"{{{{{}.v==="{}"?"":{}.v}}}}"#, node_path, COMPILE_IGNORE, node_path);
                                             children_string.push_str(&str);
                                         },
                                         _ => ()
@@ -332,41 +341,48 @@ impl TransformVisitor {
                                     self.node_stack.push(LOOP_WRAPPER_ID);
                                     let child_string = self.build_xml_element(&mut *return_value);
                                     children_string.push_str(&child_string);
+                                } else if utils::is_render_fn(callee_expr) {
+                                    let tmpl = format!(r#"<template is="{{{{xs.a(c, {}.nn, l)}}}}" data="{{{{i:{},c:c+1,l:xs.f(l,{}.nn)}}}}" />"#, node_path, node_path, node_path);
+                                    children_string.push_str(&tmpl)
+                                } else {
+                                    let code = utils::gen_template_v(&node_path);
+                                    children_string.push_str(&code);
                                 }
                             },
-                            // TODO 只支持 render 开头的函数调用返回 JSX
-                            // Expr::Call(_)
                             _ => {
-                                // println!("_ expr: {:?} ", jsx_expr);
-                                let node_path = self.get_current_node_path();
-                                let code = format!("{{{{{}.v}}}}", node_path);
+                                let code = utils::gen_template_v(&node_path);
                                 children_string.push_str(&code);
                             }
                         }
                         retain_child_counter = retain_child_counter + 1
                     },
-                    JSXElementChild::JSXText(jsx_text) => {
-                        let content = utils::jsx_text_to_string(&jsx_text.value);
+                    JSXElementChild::JSXText(JSXText { value, .. }) => {
+                        let content = utils::jsx_text_to_string(value);
                         if !content.is_empty() {
                             children_string.push_str(&content);
+                            // JSX 过滤掉静态文本节点，只在模板中保留。同时保留用于换行、空格的静态文本节点
+                            is_retain = false
+                        }
+                    },
+                    JSXElementChild::JSXFragment(child_el) => {
+                        self.node_stack.pop();
+                        let (child_string, inner_retain) = self.build_xml_children(&mut child_el.children, Some(retain_child_counter));
+                        children_string.push_str(&child_string);
+                        if inner_retain == 0 {
+                            // 静态 fragment，在 JSX 中删除
+                            is_retain = false
+                        } else {
+                            retain_child_counter += inner_retain;
                         }
+                        self.node_stack.push(retain_child_counter);
                     },
                     _ => ()
                 }
                 self.node_stack.pop();
+                return is_retain
             });
 
-        el.children.retain_mut(|item| {
-            // JSX 过滤掉静态文本节点，只在模板中保留
-            match item {
-                JSXElementChild::JSXText(jsx_text) => {
-                    utils::is_empty_jsx_text_line(&jsx_text.value)
-                },
-                _ => true
-            }
-        });
-
-        children_string
+        (children_string, retain_child_counter - start)
     }
 
     fn get_current_node_path (&self) -> String {
@@ -411,14 +427,10 @@ impl VisitMut for TransformVisitor {
         for attr in &mut el.opening.attrs {
             if let JSXAttrOrSpread::JSXAttr(jsx_attr) = attr {
                 if let JSXAttrName::Ident(jsx_attr_name) = &jsx_attr.name {
-                    if &*jsx_attr_name.sym == COMPILE_MODE {
+                    if jsx_attr_name.sym == COMPILE_MODE {
                         self.is_compile_mode = true;
                         tmpl_name = (self.get_tmpl_name)();
-                        jsx_attr.value = Some(JSXAttrValue::Lit(Lit::Str(Str {
-                            span,
-                            value: tmpl_name.clone().into(),
-                            raw: None,
-                        })));
+                        jsx_attr.value = Some(JSXAttrValue::Lit(Lit::Str(quote_str!(tmpl_name.as_str()))));
                         break;
                     }
                 }
@@ -451,12 +463,8 @@ impl VisitMut for TransformVisitor {
                     declare: false,
                     decls: vec![VarDeclarator {
                         span,
-                        name: Pat::Ident(Ident::new(format!("TARO_TEMPLATES_{}", key).as_str().into(), span).into()),
-                        init: Some(Box::new(Expr::Lit(Lit::Str(Str {
-                            span,
-                            value: value.as_str().into(),
-                            raw: None
-                        })))),
+                        name: Pat::Ident(Ident::new(Atom::new(format!("TARO_TEMPLATES_{}", key)), span).into()),
+                        init: Some(Box::new(Expr::Lit(Lit::Str(quote_str!(value.as_str()))))),
                         definite: false,
                     }],
                 }))))