Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

onNormalSize onMinSize onMaxSize #74

Merged
merged 21 commits into from
May 6, 2024
Merged

onNormalSize onMinSize onMaxSize #74

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
21 commits
Select commit Hold shift + click to select a range
4f3332e
onNormalSize onMinSize onMaxSize
BipanKishore May 5, 2024
16261b7
4.0.39
BipanKishore May 5, 2024
7062d03
id on sizeStateChange
BipanKishore May 5, 2024
35cf40d
4.0.40
BipanKishore May 5, 2024
154b2e7
maxSizeClass minSizeClass
BipanKishore May 5, 2024
13e16f7
4.0.41
BipanKishore May 5, 2024
bc02dad
fix
BipanKishore May 5, 2024
07cfeb4
4.0.42
BipanKishore May 5, 2024
ec709c6
fix
BipanKishore May 5, 2024
193625d
4.0.43
BipanKishore May 5, 2024
f0f94b0
empty token fix
BipanKishore May 5, 2024
8675cbe
4.0.44
BipanKishore May 5, 2024
0cfa488
only panes
BipanKishore May 5, 2024
2884c44
4.0.45
BipanKishore May 5, 2024
7b6ff80
added events to parent
BipanKishore May 6, 2024
438c963
4.0.46
BipanKishore May 6, 2024
262ae95
commit
BipanKishore May 6, 2024
618b92f
4.0.47
BipanKishore May 6, 2024
8d72ed1
emitResizeStop for last partially hidden for setSize Case + setSizeMe…
BipanKishore May 6, 2024
94ab3b1
4.0.48
BipanKishore May 6, 2024
a8824df
not required
BipanKishore May 6, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion cypress/component-testing/context/resizable-panes-context.cy.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ describe('should test ResizableContext: clearflagsOnNewView', () => {
})
})

it.only(`
it(`
- using api.setSize set P0 to MAX
- hide P4, P3
- using api.setSize set P0 to MAX
Expand Down
317 changes: 315 additions & 2 deletions cypress/component-testing/events.cy.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,46 @@
import React from 'react'
import {RPTestWrapper} from '../components/rp-test-wrapper'
import {RCy} from '../utils'
import {rScontainerId, CK0, CK1, R0} from './fix-test-ids'
import {_2PaneWithMinMax} from './pane-model-config-sets'
import {
rScontainerId, CK0, CK1, R0, P0, P1,
P2, P3, P4, R2, minSizeClassTest, maxSizeClassTest, R1, CK2
} from './fix-test-ids'
import {_2PaneWithMinMax, _3PanesWithMinMax} from './pane-model-config-sets'
import {SinonSpy} from 'cypress/types/sinon'
import {Pane, ResizablePanes} from '../../src'
import {CustomResizerFirst} from '../components/custom-resizer'

describe('Test inital events', () => {
it('Should emit onChangeVisibility on load', () => {
const onChangeVisibility = cy.spy()

cy.mount(
<div className="h-300 w-100p">
<ResizablePanes
maxSizeClass={maxSizeClassTest}
minSizeClass={minSizeClassTest}
resizer={<CustomResizerFirst horizontal={false} size={10} />}
resizerSize={10}
storageApi={localStorage}
uniqueId={rScontainerId}
vertical
onChangeVisibility={onChangeVisibility}
>
<Pane className="bg-cyan-500" id={P0} minSize={0.1} size={1}></Pane>
<Pane className="bg-cyan-500" id={P1} minSize={0.1} size={1}></Pane>
</ResizablePanes>
</div>
)
cy.wait(5)
.then(() => {
expect(onChangeVisibility.calledOnce).to.equal(true)
expect(onChangeVisibility.getCalls()[0].args).to.deep.equal([{
P0: 'visible',
P1: 'visible'
}])
})
})
})

describe('Test onChangeVisibility Rejected param', () => {
let onChangeVisibility: SinonSpy
Expand Down Expand Up @@ -72,3 +109,279 @@ describe('Test onChangeVisibility Rejected param', () => {
})
})
})

describe('sdf', () => {
let onMaxSize: SinonSpy
let onNormalSize: SinonSpy
let onMinSize: SinonSpy

const rCy = new RCy({
resizerSize: 10,
containerId: rScontainerId,
len: 5
})

beforeEach(() => {
rCy.setViewPort()
onMaxSize = cy.spy()
onNormalSize = cy.spy()
onMinSize = cy.spy()
cy.mount(
<div className="h-300 w-100p">
<ResizablePanes
resizer={<CustomResizerFirst horizontal={false} size={10} />}
resizerSize={10}
storageApi={localStorage}
uniqueId={rScontainerId}
vertical
>
<Pane className="bg-cyan-500" id={P0} minSize={0.1} size={1}></Pane>

<Pane
className="bg-red-500"
id={P1}
maxSize={5}
minSize={1}
size={3}
>
</Pane>
<Pane
className="bg-cyan-500"
id={P2}
maxSize={4}
minSize={0.5}
size={2}
onMaxSize={onMaxSize}
onMinSize={onMinSize}
onNormalSize={onNormalSize}
>
</Pane>

<Pane
className="bg-red-500"
id={P3}
maxSize={5}
minSize={1}
size={3}
>
</Pane>
<Pane className="bg-cyan-500" id={P4} minSize={0.1} size={1}></Pane>
</ResizablePanes>
</div>
)
})

it('sh', () => {
rCy.move(R2, rScontainerId, 'left')
cy.wait(100)
.then(() => {
expect(onMinSize.getCall(1))
console.log('v-----------------', onMinSize.getCall(1))
console.log('v-----------------', onMaxSize.getCalls())
})
})

it('sh', () => {
rCy.move(R2, rScontainerId, 'right')
cy.wait(100)
.then(() => {
console.log('v-----------------', onMinSize.getCalls())
console.log('v-----------------', onMaxSize.getCalls())
})
})
})

describe('sdf', () => {
let onMaxSize: SinonSpy
let onNormalSize: SinonSpy
let onMinSize: SinonSpy

const rCy = new RCy({
resizerSize: 10,
containerId: rScontainerId,
len: 5
})

beforeEach(() => {
rCy.setViewPort()
onMaxSize = cy.spy()
onNormalSize = cy.spy()
onMinSize = cy.spy()
cy.mount(
<div className="h-300 w-100p">
<ResizablePanes
maxSizeClass={maxSizeClassTest}
minSizeClass={minSizeClassTest}
resizer={<CustomResizerFirst horizontal={false} size={10} />}
resizerSize={10}
storageApi={localStorage}
uniqueId={rScontainerId}
vertical
onMaxSize={onMaxSize} onMinSize={onMinSize} onNormalSize={onNormalSize}
>
<Pane className="bg-cyan-500" id={P0} minSize={0.1} size={1}></Pane>
<Pane className="bg-red-500" id={P1} maxSize={5} minSize={1} size={3}>
</Pane>
<Pane className="bg-cyan-500" id={P2} maxSize={4} minSize={0.5} size={2}>
</Pane>

<Pane className="bg-red-500" id={P3} maxSize={5} minSize={1} size={3} >
</Pane>
<Pane className="bg-cyan-500" id={P4} minSize={0.1} size={1}></Pane>
</ResizablePanes>
</div>
)
})

it('sh', () => {
rCy.move(R2, rScontainerId, 'left')
cy.wait(100)
.then(() => {
expect(rCy.getAllArgs(onMinSize)).to.deep.equal(
[
[
'P0',
10
],
[
'P1',
100
],
[
'P2',
50
]
]
)

expect(rCy.getAllArgs(onMaxSize)).to.deep.equal(
[
[
'P3',
500
]
]
)
})
})

it('sh', () => {
rCy.move(R1, rScontainerId, 'right')
cy.wait(100)
.then(() => {
expect(rCy.getAllArgs(onMinSize)).to.deep.equal(
[
[
'P2',
50
],
[
'P3',
100
],
[
'P4',
10
]
]
)
expect(rCy.getAllArgs(onMaxSize)).to.deep.equal(
[[
'P1',
500
]]
)
})
})

it('sh', () => {
rCy.move(R1, rScontainerId, 'right')
cy.wait(100)
.then(() => {
expect(rCy.getAllArgs(onMinSize)).to.deep.equal(
[
[
'P2',
50
],
[
'P3',
100
],
[
'P4',
10
]
]
)
expect(rCy.getAllArgs(onMaxSize)).to.deep.equal(
[[
'P1',
500
]]
)
})
})

it('sh', () => {
rCy.move(R2, rScontainerId, 'right')
cy.wait(100)
.then(() => {
console.log('v-----------------', onMinSize.getCalls())
console.log('v-----------------', onMaxSize.getCalls())
})
})
})

describe('_3PanesWithMinMax_3PanesWithMinMax', () => {
let onMaxSize: SinonSpy
let onNormalSize: SinonSpy
let onMinSize: SinonSpy

const rCy = new RCy({
resizerSize: 1,
containerId: rScontainerId,
len: 3
})

beforeEach(() => {
rCy.setViewPort()

onMaxSize = cy.spy()
onNormalSize = cy.spy()
onMinSize = cy.spy()

cy.mount(
<RPTestWrapper
maxSizeClass='bg-red-500'
panesList={_3PanesWithMinMax}
resizerClass='bg-slate-500'
resizerSize={1}
storageApi={localStorage}
uniqueId={rScontainerId}
vertical
onMaxSize={onMaxSize}
onMinSize={onMinSize}
onNormalSize={onNormalSize}
>
</RPTestWrapper>
)
})

it.skip('asdf', () => {
rCy.cyGet(CK2).click()
rCy.move(R0, rScontainerId, 'right')

cy.wait(100)
.then(() => {
rCy.cyGet(P0)
.should('have.css', 'class')
.then((e) => {
console.log(e)
})

console.log('v-----------------onMinSize ', onMinSize.getCalls())
console.log('v----------------- onMaxSize', onMaxSize.getCalls())
})
})
})
3 changes: 3 additions & 0 deletions cypress/component-testing/fix-test-ids.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,9 @@ const rScontainerId = 'rScontainerId'
const containerId = rScontainerId
const mountUnMountButtonId = 'hide-resizable-panes'

export const minSizeClassTest = 'minSizeClassTest'
export const maxSizeClassTest = 'maxSizeClassTest'

const loadingId = 'loading'
const loadedId = 'loaded'
export {
Expand Down
6 changes: 6 additions & 0 deletions cypress/component-testing/pane-model-config-sets.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,12 @@ export const _2PaneWithNoMinMax = [
new PaneModelConfig(4)
]

export const _3PanesWithMinMax = [
new PaneModelConfig(3, 1, 6),
new PaneModelConfig(2),
new PaneModelConfig(3, 1, 6)
]

export const noMinMaxEqualSize7PanesSet = [
new PaneModelConfig(1),
new PaneModelConfig(1),
Expand Down
Loading
Loading