Skip to content

Commit

Permalink
refactor: remove Space & Grid IE compatible logic (ant-design#44620)
Browse files Browse the repository at this point in the history 
* refactor: remove IE compatible logic

* fix: fix

* fix: fix

* fix: fix
  • Loading branch information
@li-jia-nan
li-jia-nan authored Sep 5, 2023
1 parent 46341b1 commit 6a5e7de
Show file tree
Hide file tree
Showing 119 changed files with 931 additions and 2,824 deletions.
11 changes: 0 additions & 11 deletions components/_util/hooks/useFlexGapSupport.ts
View file

This file was deleted.

35 changes: 0 additions & 35 deletions components/_util/styleChecker.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,38 +4,3 @@ import { isStyleSupport } from 'rc-util/lib/Dom/styleChecker';
export const canUseDocElement = () => canUseDom() && window.document.documentElement;

export { isStyleSupport };

let flexGapSupported: boolean;
export const detectFlexGapSupported = () => {
if (!canUseDocElement()) {
return false;
}

if (flexGapSupported !== undefined) {
return flexGapSupported;
}

// create flex container with row-gap set
const flex = document.createElement('div');
flex.style.display = 'flex';
flex.style.flexDirection = 'column';
flex.style.rowGap = '1px';

// create two, elements inside it
flex.appendChild(document.createElement('div'));
flex.appendChild(document.createElement('div'));

// some browser may not repaint when remove nodes, so we need create a new layer to detect.
const container = document.createElement('div');
container.style.position = 'absolute';
container.style.zIndex = '-9999';
container.appendChild(flex);


// append to the DOM (needed to obtain scrollHeight)
document.body.appendChild(container);
flexGapSupported = flex.scrollHeight === 1; // flex container should be 1px high from the row-gap
document.body.removeChild(container);

return flexGapSupported;
};
51 changes: 10 additions & 41 deletions components/alert/__tests__/__snapshots__/demo-extend.test.ts.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,11 @@

exports[`renders components/alert/demo/action.tsx extend context correctly 1`] = `
<div
class="ant-space ant-space-vertical"
class="ant-space ant-space-vertical ant-space-gap-row-small ant-space-gap-col-small"
style="width: 100%;"
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-success"
Expand Down Expand Up @@ -84,7 +83,6 @@ exports[`renders components/alert/demo/action.tsx extend context correctly 1`] =
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-error ant-alert-with-description"
Expand Down Expand Up @@ -141,7 +139,6 @@ exports[`renders components/alert/demo/action.tsx extend context correctly 1`] =
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-warning ant-alert-no-icon"
Expand All @@ -161,7 +158,7 @@ exports[`renders components/alert/demo/action.tsx extend context correctly 1`] =
class="ant-alert-action"
>
<div
class="ant-space ant-space-horizontal ant-space-align-center"
class="ant-space ant-space-horizontal ant-space-align-center ant-space-gap-row-small ant-space-gap-col-small"
>
<div
class="ant-space-item"
Expand Down Expand Up @@ -231,11 +228,10 @@ exports[`renders components/alert/demo/action.tsx extend context correctly 1`] =
class="ant-alert-action"
>
<div
class="ant-space ant-space-vertical"
class="ant-space ant-space-vertical ant-space-gap-row-small ant-space-gap-col-small"
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<button
class="ant-btn ant-btn-primary ant-btn-sm"
Expand Down Expand Up @@ -299,12 +295,11 @@ exports[`renders components/alert/demo/action.tsx extend context correctly 2`] =

exports[`renders components/alert/demo/banner.tsx extend context correctly 1`] = `
<div
class="ant-space ant-space-vertical"
class="ant-space ant-space-vertical ant-space-gap-row-small ant-space-gap-col-small"
style="width: 100%;"
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-warning ant-alert-banner"
Expand Down Expand Up @@ -343,7 +338,6 @@ exports[`renders components/alert/demo/banner.tsx extend context correctly 1`] =
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-warning ant-alert-banner"
Expand Down Expand Up @@ -408,7 +402,6 @@ exports[`renders components/alert/demo/banner.tsx extend context correctly 1`] =
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-warning ant-alert-no-icon ant-alert-banner"
Expand Down Expand Up @@ -492,12 +485,11 @@ exports[`renders components/alert/demo/basic.tsx extend context correctly 2`] =

exports[`renders components/alert/demo/closable.tsx extend context correctly 1`] = `
<div
class="ant-space ant-space-vertical"
class="ant-space ant-space-vertical ant-space-gap-row-small ant-space-gap-col-small"
style="width: 100%;"
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-warning ant-alert-no-icon"
Expand Down Expand Up @@ -598,12 +590,11 @@ exports[`renders components/alert/demo/closable.tsx extend context correctly 2`]

exports[`renders components/alert/demo/custom-icon.tsx extend context correctly 1`] = `
<div
class="ant-space ant-space-vertical"
class="ant-space ant-space-vertical ant-space-gap-row-small ant-space-gap-col-small"
style="width: 100%;"
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-success ant-alert-no-icon"
Expand All @@ -623,7 +614,6 @@ exports[`renders components/alert/demo/custom-icon.tsx extend context correctly
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-success"
Expand Down Expand Up @@ -662,7 +652,6 @@ exports[`renders components/alert/demo/custom-icon.tsx extend context correctly
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-info"
Expand Down Expand Up @@ -701,7 +690,6 @@ exports[`renders components/alert/demo/custom-icon.tsx extend context correctly
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-warning"
Expand Down Expand Up @@ -740,7 +728,6 @@ exports[`renders components/alert/demo/custom-icon.tsx extend context correctly
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-error"
Expand Down Expand Up @@ -779,7 +766,6 @@ exports[`renders components/alert/demo/custom-icon.tsx extend context correctly
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-success ant-alert-with-description"
Expand Down Expand Up @@ -823,7 +809,6 @@ exports[`renders components/alert/demo/custom-icon.tsx extend context correctly
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-info ant-alert-with-description"
Expand Down Expand Up @@ -867,7 +852,6 @@ exports[`renders components/alert/demo/custom-icon.tsx extend context correctly
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-warning ant-alert-with-description"
Expand Down Expand Up @@ -959,12 +943,11 @@ exports[`renders components/alert/demo/custom-icon.tsx extend context correctly

exports[`renders components/alert/demo/description.tsx extend context correctly 1`] = `
<div
class="ant-space ant-space-vertical"
class="ant-space ant-space-vertical ant-space-gap-row-small ant-space-gap-col-small"
style="width: 100%;"
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-success ant-alert-with-description ant-alert-no-icon"
Expand All @@ -989,7 +972,6 @@ exports[`renders components/alert/demo/description.tsx extend context correctly
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-info ant-alert-with-description ant-alert-no-icon"
Expand All @@ -1014,7 +996,6 @@ exports[`renders components/alert/demo/description.tsx extend context correctly
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-warning ant-alert-with-description ant-alert-no-icon"
Expand Down Expand Up @@ -1081,12 +1062,11 @@ exports[`renders components/alert/demo/error-boundary.tsx extend context correct

exports[`renders components/alert/demo/icon.tsx extend context correctly 1`] = `
<div
class="ant-space ant-space-vertical"
class="ant-space ant-space-vertical ant-space-gap-row-small ant-space-gap-col-small"
style="width: 100%;"
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-success"
Expand Down Expand Up @@ -1125,7 +1105,6 @@ exports[`renders components/alert/demo/icon.tsx extend context correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-info"
Expand Down Expand Up @@ -1164,7 +1143,6 @@ exports[`renders components/alert/demo/icon.tsx extend context correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-warning"
Expand Down Expand Up @@ -1229,7 +1207,6 @@ exports[`renders components/alert/demo/icon.tsx extend context correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-error"
Expand Down Expand Up @@ -1269,7 +1246,6 @@ exports[`renders components/alert/demo/icon.tsx extend context correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-success ant-alert-with-description"
Expand Down Expand Up @@ -1313,7 +1289,6 @@ exports[`renders components/alert/demo/icon.tsx extend context correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-info ant-alert-with-description"
Expand Down Expand Up @@ -1357,7 +1332,6 @@ exports[`renders components/alert/demo/icon.tsx extend context correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-warning ant-alert-with-description"
Expand Down Expand Up @@ -1476,12 +1450,11 @@ exports[`renders components/alert/demo/icon.tsx extend context correctly 2`] = `

exports[`renders components/alert/demo/smooth-closed.tsx extend context correctly 1`] = `
<div
class="ant-space ant-space-vertical"
class="ant-space ant-space-vertical ant-space-gap-row-small ant-space-gap-col-small"
style="width: 100%;"
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-success ant-alert-no-icon"
Expand Down Expand Up @@ -1527,7 +1500,6 @@ exports[`renders components/alert/demo/smooth-closed.tsx extend context correctl
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<p>
click the close button to see the effect
Expand Down Expand Up @@ -1565,12 +1537,11 @@ exports[`renders components/alert/demo/smooth-closed.tsx extend context correctl

exports[`renders components/alert/demo/style.tsx extend context correctly 1`] = `
<div
class="ant-space ant-space-vertical"
class="ant-space ant-space-vertical ant-space-gap-row-small ant-space-gap-col-small"
style="width: 100%;"
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-success ant-alert-no-icon"
Expand All @@ -1590,7 +1561,6 @@ exports[`renders components/alert/demo/style.tsx extend context correctly 1`] =
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-info ant-alert-no-icon"
Expand All @@ -1610,7 +1580,6 @@ exports[`renders components/alert/demo/style.tsx extend context correctly 1`] =
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
>
<div
class="ant-alert ant-alert-warning ant-alert-no-icon"
Expand Down
Loading

0 comments on commit 6a5e7de

Please sign in to comment.