Skip to content

Instantly share code, notes, and snippets.

@hiikezoe
Created July 19, 2023 22:31
Show Gist options
  • Save hiikezoe/1c3b93da9bc00fc412dda965b5955253 to your computer and use it in GitHub Desktop.
Save hiikezoe/1c3b93da9bc00fc412dda965b5955253 to your computer and use it in GitHub Desktop.
Video frame tree
HTMLVideo(video)(0)@7fa35ecc1938 parent=7fa35ecc17a8 (x=0, y=-360, w=640, h=360) [content=7fa363f16200] [cs=7fa362f50978] <
ImageFrame(img)(-1)@7fa35ecc1a10 parent=7fa35ecc1938 next=7fa35ecc1870 (x=0, y=0, w=0, h=0) ink-overflow=(x=0, y=0, w=24, h=24) [content=7fa363f22100] [cs=7fa362f7b7a8]
Block(div)(-1)@7fa35ecc1870 parent=7fa35ecc1938 next=7fa35ed3b3f0 (x=0, y=0, w=640, h=360) [content=7fa355a39790] [cs=7fa35ec9c028] <
>
HTMLScroll(div)(0)@7fa35ed3b3f0 parent=7fa35ecc1938 (x=0, y=0, w=640, h=360) [content=7fa355a3a1f0] [cs=7fa362f7b5c8] <
Block(div)(0)@7fa35ed3ca20 parent=7fa35ed3b3f0 (x=0, y=0, w=640, h=360) [content=7fa355a3a1f0] [cs=7fa353f2a978:-moz-scrolled-content] <
line@7fa35ed3c748 count=1 state=inline,clean,prevmarginclean,not-impacted,not-wrapped,no-break,clear-before:none,clear-after:none(x=0, y=0, w=0, h=0) <
Text(2)"\n "@7fa35edae448 parent=7fa35ed3ca20 next=7fa35ed3cb68 (x=0, y=0, w=0, h=0) [content=7fa355a34b80] [cs=7fa35ec89e28:-moz-text] [run=0][0,9,T]
>
line@7fa35ed3c7e8 count=1 state=block,clean,prevmarginclean,not-impacted,not-wrapped,no-break,clear-before:none,clear-after:none(x=0, y=0, w=640, h=360) <
Block(div id=controlsContainer)(5)@7fa35ed3cb68 parent=7fa35ed3ca20 (x=0, y=0, w=640, h=360) normal-position=(0,0) [content=7fa355a3a280] [cs=7fa362f99798] <
line@7fa35ed3c798 count=1 state=block,clean,prevmarginclean,not-impacted,not-wrapped,no-break,clear-before:none,clear-after:none(x=0, y=0, w=640, h=360) <
FlexContainer(div)(1)@7fa35edad2d8 parent=7fa35ed3cb68 (x=0, y=0, w=640, h=360) normal-position=(0,0) [content=7fa355a3a310] [cs=7fa36399f7a8] <
Placeholder(button id=pictureInPictureToggle)(1)@7fa35ed3c018 parent=7fa35edad2d8 (x=0, y=0, w=0, h=0) [content=7fa355c72b50] [cs=7fa35ec644d8:-moz-oof-placeholder] outOfFlowFrame=HTMLButtonControl(button id=pictureInPictureToggle)(1)@7fa35ed99410
AbsoluteList@7fa35edc4c60 <
HTMLButtonControl(button id=pictureInPictureToggle)(1)@7fa35ed99410 parent=7fa35edad2d8 (x=582, y=212, w=0, h=2) ink-overflow=(x=-166, y=-2, w=212, h=72) scr-overflow=(x=-160, y=0, w=200, h=60) [content=7fa355c72b50] [cs=7fa36401d898] <
Block(button id=pictureInPictureToggle)(1)@7fa35ed3cc30 parent=7fa35ed99410 (x=0, y=1, w=0, h=0) [content=7fa355c72b50] [cs=7fa36401e798:-moz-button-content] <
line@7fa35ed3c838 count=5 state=inline,clean,prevmarginclean,not-impacted,not-wrapped,no-break,clear-before:none,clear-after:none(x=0, y=0, w=0, h=0) <
Placeholder(div)(1)@7fa35ed3ccf8 parent=7fa35ed3cc30 next=7fa35edceeb0 (x=0, y=0, w=0, h=0) [content=7fa355a3a3a0] [cs=7fa35ec644d8:-moz-oof-placeholder] outOfFlowFrame=Block(div)(1)@7fa35ed98020
Text(2)"\n "@7fa35edceeb0 parent=7fa35ed3cc30 next=7fa35ed3ce40 (x=0, y=0, w=0, h=0) [content=7fa355a34e00] [cs=7fa3639a0a68:-moz-text] [run=7fa35e61e1f0][0,15,T]
Placeholder(div)(3)@7fa35ed3ce40 parent=7fa35ed3cc30 next=7fa35ed996d8 (x=0, y=0, w=0, h=0) [content=7fa355a3a430] [cs=7fa35ec644d8:-moz-oof-placeholder] outOfFlowFrame=FlexContainer(div)(3)@7fa35ed985f8
Text(4)"\n "@7fa35ed996d8 parent=7fa35ed3cc30 next=7fa35ed98168 (x=0, y=0, w=0, h=0) [content=7fa355a3b200] [cs=7fa3639a0a68:-moz-text] [run=7fa362ea1200][0,15,T]
Text(6)"\n "@7fa35ed98168 parent=7fa35ed3cc30 (x=0, y=0, w=0, h=0) [content=7fa355a3b280] [cs=7fa3639a0a68:-moz-text] [run=7fa362ea1200][0,13,T]
>
>
AbsoluteList@7fa35edc4cc0 <
Block(div)(1)@7fa35ed98020 parent=7fa35ed99410 next=7fa35ed985f8 (x=0, y=0, w=40, h=40) ink-overflow=(x=-6, y=-2, w=52, h=52) [content=7fa355a3a3a0] [cs=7fa36401e6a8] <
>
FlexContainer(div)(3)@7fa35ed985f8 parent=7fa35ed99410 (x=0, y=0, w=200, h=40) ink-overflow=(x=-166, y=-2, w=212, h=72) scr-overflow=(x=-160, y=0, w=200, h=60) pre-transform-ink-overflow=(x=-6, y=-2, w=212, h=72) pre-transform-scr-overflow=(x=0, y=0, w=200, h=60) transformed [content=7fa355a3a430] [cs=7fa36401da78] <
FlexContainer(span)(1)@7fa35ed989c8 parent=7fa35ed985f8 next=7fa354b6e680 (x=2, y=8, w=154.45, h=24) [content=7fa355a3a4c0] [cs=7fa36401db68] <
Block(span)(1)@7fa35ed3c8d8 parent=7fa35ed989c8 next=7fa35ed3b820 (x=8, y=0, w=24, h=24) normal-position=(8,0) [content=7fa355a3a550] [cs=7fa36401e4c8] <
>
Block(span)(3)@7fa35ed3b820 parent=7fa35ed989c8 (x=40, y=4, w=106.45, h=16) [content=7fa355a3a5e0] [cs=7fa36401e5b8] <
line@7fa35ed982f8 count=1 state=inline,clean,prevmarginclean,not-impacted,not-wrapped,no-break,clear-before:none,clear-after:none(x=0, y=0, w=106.45, h=16) <
Text(0)"Pop out this video"@7fa35ed3cec0 parent=7fa35ed3b820 (x=0, y=0, w=106.45, h=16) [content=7fa355a3b480] [cs=7fa354043018:-moz-text] [run=7fa3506f4530][0,18,T]
>
>
>
Placeholder(div)(3)@7fa354b6e680 parent=7fa35ed985f8 (x=2, y=2, w=0, h=0) [content=7fa355a3a670] [cs=7fa35ec644d8:-moz-oof-placeholder] outOfFlowFrame=Block(div)(3)@7fa35ed3b688
AbsoluteList@7fa35eddd420 <
Block(div)(3)@7fa35ed3b688 parent=7fa35ed985f8 (x=0, y=2, w=200, h=58) ink-overflow=(x=-6, y=-2, w=212, h=70) scr-overflow=(x=0, y=0, w=200, h=58) transformed [content=7fa355a3a670] [cs=7fa36401e3d8] <
line@7fa35ed982a8 count=1 state=inline,clean,prevmarginclean,not-impacted,wrapped,no-break,clear-before:none,clear-after:none(x=10, y=6, w=159.733, h=14) ink-overflow=(x=10, y=6, w=162.267, h=14) scr-overflow=(x=10, y=6, w=159.733, h=14) <
Text(0)"More screens are more fun. Play "@7fa354b74640 parent=7fa35ed3b688 next=7fa3576dda70 next-in-flow=7fa3576dda70 (x=10, y=6, w=159.733, h=14) ink-overflow=(x=0, y=0, w=162.267, h=14) scr-overflow=(x=0, y=0, w=159.733, h=14) [content=7fa355a3b500] [cs=7fa35ec9c2f8:-moz-text] [run=7fa3507e2720][0,32,F]
>
line@7fa35ed98258 count=1 state=inline,clean,prevmarginclean,not-impacted,wrapped,no-break,clear-before:none,clear-after:none(x=10, y=20, w=144.05, h=14) ink-overflow=(x=10, y=20, w=146.583, h=14) scr-overflow=(x=10, y=20, w=144.05, h=14) <
Text(0)"this video while you do other "@7fa3576dda70 parent=7fa35ed3b688 next=7fa3576dc170 prev-in-flow=7fa354b74640 next-in-flow=7fa3576dc170 (x=10, y=20, w=144.05, h=14) ink-overflow=(x=0, y=0, w=146.583, h=14) scr-overflow=(x=0, y=0, w=144.05, h=14) [content=7fa355a3b500] [cs=7fa35ec9c2f8:-moz-text] [run=7fa3507e2720][32,30,F]
>
line@7fa35ed98208 count=1 state=inline,clean,prevmarginclean,not-impacted,not-wrapped,no-break,clear-before:none,clear-after:none(x=10, y=34, w=33.75, h=14) <
Text(0)"things."@7fa3576dc170 parent=7fa35ed3b688 prev-in-flow=7fa3576dda70 (x=10, y=34, w=33.75, h=14) [content=7fa355a3b500] [cs=7fa35ec9c2f8:-moz-text] [run=7fa3507e2720][62,7,T]
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment