fix: prevent from creating multi portals

[tmkx]

close react-component/util#293

[zombieJ]

Will this also execute multiple time as FC first render?

[tmkx]

render will be double-invoked, but if (!this.portalContainer) can ensure getContainer is called only once.

[zombieJ]

So class component will be the same instance but FC will not. Right?

[tmkx]

So are you going to rewrite Portal to a class component? 😂

[zombieJ]

Noop. Just confirm of this : )

Pls patch a comment here to tell that refactor will FC will break the behavior which helps refactor in future.

[tmkx]

Updated, maybe not fully understood.

[zombieJ]

I mean comment this line: https://github.com/react-component/trigger/pull/292/files#diff-0b5adbfe7b36e4ae2f479291e20152e33e940f7f265162d77f40f6bdb5da7405R865

For example:

In React.StrictMode component will call render multiple time in first mount. When you want to refactor with FC, useRef will also init multiple time and point to different useRef instance which will create multiple element (This multiple render will not trigger effect so you can not clean up this in effect). But this is safe with class component since it always point to same class instance.

[tmkx]

Okay, nice clear

[tmkx]

Actually, it's the same as FC in some ways.

class component behavior:

constructor r3mjrhp00qn
constructor 7df2h5d7k9e
render 7df2h5d7k9e
render 7df2h5d7k9e

just because that we call getContainer in render (which happened in second one, 7df2h5d7k9e).

[codecov]

Codecov Report

Merging #292 (3c42158) into master (ac05814) will increase coverage by 0.05%.
The diff coverage is 100.00%.

@@            Coverage Diff             @@
##           master     #292      +/-   ##
==========================================
+ Coverage   89.36%   89.42%   +0.05%     
==========================================
  Files          11       11              
  Lines         536      539       +3     
  Branches      137      138       +1     
==========================================
+ Hits          479      482       +3     
  Misses         57       57              

Impacted Files	Coverage Δ
src/index.tsx	86.78% <100.00%> (+0.11%)	⬆️

📣 Codecov can now indicate which changes are the most critical in Pull Requests. Learn more

[zombieJ]

Strange. antd CI failed. https://github.com/ant-design/ant-design/runs/5984746938?check_suite_focus=true

[tmkx]

I'll take a look.

[zombieJ]

Let me revert this first.

[tmkx]

This patch is compatible, and should not cause any breaking change. Curiously, lib passed but es failed, is it cause by this? https://github.com/ant-design/ant-design/blob/62233426f30b2b7508291a15583aa9f251df0622/.github/workflows/test.yml#L364-L370

[zombieJ]

Find the reason. Origin getContainer is called in Portal render. But current logic makes render div on the Trigger render which raise the render before. Let me patch this.

[tmkx]

Find the reason. Origin getContainer is called in Portal render. But current logic makes render div on the Trigger render which raise the render before. Let me patch this.

Got it, it should like this:

<Portal
  getContainer={() => {
    if (xxx) {
      // ...
    }
    return ...
  }}
  ...
  />