diff --git a/scripts/__tests__/ComponentTest/PortalComponent.test.js b/scripts/__tests__/ComponentTest/PortalComponent.test.js index 05908f18..5743093d 100755 --- a/scripts/__tests__/ComponentTest/PortalComponent.test.js +++ b/scripts/__tests__/ComponentTest/PortalComponent.test.js @@ -1,5 +1,6 @@ import * as Horizon from '@cloudsop/horizon/index.ts'; import { getLogUtils } from '../jest/testUtils'; +import dispatchChangeEvent from '../utils/dispatchChangeEvent'; describe('PortalComponent Test', () => { const LogUtils = getLogUtils(); @@ -235,4 +236,45 @@ describe('PortalComponent Test', () => { btnRef.current.click(); expect(onClick).toHaveBeenCalledTimes(1); }); + + it('Portal onChange should activate', () => { + class Dialog extends Horizon.Component { + node; + + constructor(props) { + super(props); + this.node = window.document.createElement('div'); + window.document.body.appendChild(this.node); + } +`` render() { + return Horizon.createPortal(this.props.children, this.node); + } + } + + let showPortalInput; + const fn = jest.fn(); + const inputRef = Horizon.createRef(); + function Input() { + const [show, setShow] = Horizon.useState(false); + showPortalInput = setShow; + + Horizon.useEffect(() => { + setTimeout(() => { + setShow(true); + }, 0); + }, []); + + if (!show) { + return null; + } + + return ; + } + + Horizon.render(
, container); + showPortalInput(true); + jest.advanceTimersToNextTimer(); + dispatchChangeEvent(inputRef.current, 'test'); + expect(fn).toHaveBeenCalledTimes(1); + }); }); diff --git a/scripts/__tests__/utils/dispatchChangeEvent.js b/scripts/__tests__/utils/dispatchChangeEvent.js new file mode 100644 index 00000000..1b8bbd04 --- /dev/null +++ b/scripts/__tests__/utils/dispatchChangeEvent.js @@ -0,0 +1,9 @@ +/* + * Copyright (c) Huawei Technologies Co., Ltd. 2022-2022. All rights reserved. + */ +export default function dispatchChangeEvent(inputEle, value) { + const nativeInputSetter = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, 'value').set; + nativeInputSetter.call(inputEle, value); + + inputEle.dispatchEvent(new Event('input', { bubbles: true})); +}