From 6182d9359c472f564aecda44e80d6156806cd132 Mon Sep 17 00:00:00 2001 From: lancely Date: Wed, 17 Jan 2024 17:01:21 +0800 Subject: [PATCH 1/4] fix(Tree): [Tree] content whit long text align-right issue, close #4689 --- components/tree/__tests__/index-spec.js | 59 +++++++++++++++++++++++++ components/tree/main.scss | 1 + 2 files changed, 60 insertions(+) diff --git a/components/tree/__tests__/index-spec.js b/components/tree/__tests__/index-spec.js index 60b2faa5c0..ef3b8595f7 100644 --- a/components/tree/__tests__/index-spec.js +++ b/components/tree/__tests__/index-spec.js @@ -264,6 +264,65 @@ describe('Tree', () => { assertTree({ children: loop(dataSource), dataSource }, mountNode); }); + it.only('should switcher ignore flex when node is long text', () => { + const x = 3; + const y = 2; + const z = 1; + const gData = []; + + const generateData = (_level, _preKey, _tns) => { + const preKey = _preKey || '0'; + const tns = _tns || gData; + + const children = []; + for (let i = 0; i < x; i++) { + let key = `${preKey}-${i}`; + key = key === '0-0-0-1' ? '我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的': key; + + tns.push({ label: key, key }); + + if (i < y) { + children.push(key); + } + } + + if (_level < 0) { + return tns; + } + + const level = _level - 1; + children.forEach((key, index) => { + tns[index].children = []; + return generateData(level, key, tns[index].children); + }); + }; + + generateData(z); + const loop = data => + data.map(item => { + if (item.children) { + return ( + + {loop(item.children)} + + ); + } + return ; + }); + ReactDOM.render( + + {loop(gData)} + , + mountNode + ); + const switcherList = document.querySelectorAll('.next-tree-switcher'); + assert(Array.from(switcherList).every((v)=>v.clientWidth !== 0)); + }); + it('should ignore children contain null or string', () => { ReactDOM.render( diff --git a/components/tree/main.scss b/components/tree/main.scss index 96acb11fec..acb368fcdd 100644 --- a/components/tree/main.scss +++ b/components/tree/main.scss @@ -127,6 +127,7 @@ } &-switcher.#{$css-prefix}noop-noline { + flex: none !important; width: $tree-switch-arrow-size; height: $tree-switch-arrow-size; } From 34966e322192a8d765d0944d131b64d97c8a68bf Mon Sep 17 00:00:00 2001 From: lancely Date: Wed, 17 Jan 2024 17:13:07 +0800 Subject: [PATCH 2/4] chore(Tree): remove unnecessary css specificity close #4689 --- components/tree/main.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/tree/main.scss b/components/tree/main.scss index acb368fcdd..99bfd34d50 100644 --- a/components/tree/main.scss +++ b/components/tree/main.scss @@ -127,7 +127,7 @@ } &-switcher.#{$css-prefix}noop-noline { - flex: none !important; + flex: none; width: $tree-switch-arrow-size; height: $tree-switch-arrow-size; } From bc0b058149fb4a79659197ba008c35cf3ac8c865 Mon Sep 17 00:00:00 2001 From: lancely Date: Tue, 23 Jan 2024 19:19:22 +0800 Subject: [PATCH 3/4] chore(Tree): ret test code,close #4689 --- components/tree/__tests__/index-spec.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/tree/__tests__/index-spec.js b/components/tree/__tests__/index-spec.js index ef3b8595f7..1ab0f8b76c 100644 --- a/components/tree/__tests__/index-spec.js +++ b/components/tree/__tests__/index-spec.js @@ -264,7 +264,7 @@ describe('Tree', () => { assertTree({ children: loop(dataSource), dataSource }, mountNode); }); - it.only('should switcher ignore flex when node is long text', () => { + it('should switcher ignore flex when node is long text', () => { const x = 3; const y = 2; const z = 1; From 1e253ccadf29ff02326432c69f0fe7c6691f29ad Mon Sep 17 00:00:00 2001 From: lancely Date: Tue, 23 Jan 2024 21:55:09 +0800 Subject: [PATCH 4/4] chore(Tree): update test code ,close #4689 --- components/tree/__tests__/index-spec.js | 50 ++----------------------- 1 file changed, 3 insertions(+), 47 deletions(-) diff --git a/components/tree/__tests__/index-spec.js b/components/tree/__tests__/index-spec.js index 1ab0f8b76c..29d86c1c38 100644 --- a/components/tree/__tests__/index-spec.js +++ b/components/tree/__tests__/index-spec.js @@ -265,62 +265,18 @@ describe('Tree', () => { }); it('should switcher ignore flex when node is long text', () => { - const x = 3; - const y = 2; - const z = 1; - const gData = []; - - const generateData = (_level, _preKey, _tns) => { - const preKey = _preKey || '0'; - const tns = _tns || gData; - - const children = []; - for (let i = 0; i < x; i++) { - let key = `${preKey}-${i}`; - key = key === '0-0-0-1' ? '我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的我内容超长的': key; - - tns.push({ label: key, key }); - - if (i < y) { - children.push(key); - } - } - - if (_level < 0) { - return tns; - } - - const level = _level - 1; - children.forEach((key, index) => { - tns[index].children = []; - return generateData(level, key, tns[index].children); - }); - }; - - generateData(z); - const loop = data => - data.map(item => { - if (item.children) { - return ( - - {loop(item.children)} - - ); - } - return ; - }); ReactDOM.render( - {loop(gData)} + long text} /> , mountNode ); - const switcherList = document.querySelectorAll('.next-tree-switcher'); - assert(Array.from(switcherList).every((v)=>v.clientWidth !== 0)); + const switcher = document.querySelector('.long-text-node .next-tree-switcher'); + assert(switcher && switcher.clientWidth); }); it('should ignore children contain null or string', () => {