ResizeObserver
lib.dom.ts
μλ ResizeObserver API μ μΈμ΄ ν¬ν¨λμ§ μμ΅λλ€.
ResizeObserverλ 2018 λ μ μΌλΆ μ§μ μ λ°κ³
λ΄ μ μμ λ€μ μ§μΉ¨μ μΆ©μ‘±ν©λλ€.
νΉν λΈλΌμ°μ μ§μμ΄ κ±°μ μ‘΄μ¬νμ§ μλ κ²½μ° νμ€ μ ν μ μκ° μ€νμ APIμ ν¨κ» μ 곡λμ§ μλ κ²μ΄ μλμ μ΄λΌκ³ μκ°ν©λλ€.
μ΄μ νμ€ μΉ IDL νμΌμμ https://github.com/Microsoft/TSJS-lib-generator μμ libλ₯Ό μμ±ν©λλ€. μ΄ νμΌ μλ libλ₯Ό μμ±νλ IDL λͺ©λ‘ common dom μΈν°νμ΄μ€ IDLμ λλ¬νλ©΄ λκΈ°ννμ¬ μ¬μ©ν μ μμ΅λλ€. κ·Έλ κ² λ λκΉμ§ μ½κ°μ μκ° (κ·Έλ¦¬κ³ μλ§λ ν¨μ¬ λ λμ λΈλΌμ°μ μ§μ)μ΄ λ κ²μ λλ€. κ·Έλμ νλ‘μ νΈμ λ‘μ»¬λ‘ μΆκ° μ μΈμ μΆκ°νλ κ²μ΄ μ’μ΅λλ€. μμ§ μ€νμ μΈ νλͺ©μ λν μ¬μ μμ λν΄ PRμ μννμ§ μμ κ²μ΄λΌκ³ μκ°νκΈ° λλ¬Έμ λλ€.
@weswigham μμμ λ°κ°μμ ! κ°μ¬ν©λλ€.
κ·Έλμ νλ‘μ νΈμ λ‘μ»¬λ‘ μΆκ° μ μΈμ μΆκ°νλ κ²μ΄ μ’μ΅λλ€.
Typescript κ΄μ μμ μ΄λ¬ν μ μΈμ λ£μ μ¬λ°λ₯Έ μμΉλ 무μμ λκΉ? resize-observer-polyfill μ μ½λ κ³ λ €
νλ‘μ νΈμ λͺ¨λ νμΌμ΄ κ°λ₯ν©λλ€. λ§μ μ¬λλ€μ΄ μ΄μ κ°μ κ²μ λν΄ λ³λμ globals.d.ts
μΆμ²ν©λλ€.
@weswigham μμ¦ λ€μ λ°©λ¬Έν΄μΌ ν κ²
λͺ¨λ μ£Όμ λΈλΌμ°μ λ Firefox (68-69), Safari (νμ€ν MacOS Catalinaμ ν¨κ» μΆμ λ λ€μ Safariμμ μ¬μ© κ°λ₯ν κΈ°μ 미리보기), Chrome, Edge w / Chromium λ±μ μΌλμλκ³ μ΄λ₯Ό μ§μν©λλ€.
νμ¬μ΄ λ¬Έμ μ λν CaniUse λ°μ΄ν°λ μ λ°μ΄νΈλμμ΅λλ€. IIRC : https://caniuse.com/#search = ResizeObserver
μ΄ λ¬Έμ λ 'μ§λ¬Έ'μΌλ‘ νμλμμΌλ©° μ΅κ·Ό νλμ΄ μμ΅λλ€. μ²μλ₯Ό μν΄ μλμΌλ‘ λ«νμ΅λλ€. μ¬μ ν μλ΅μ κΈ°λ€λ¦¬κ³ μλ€λ©΄ μ§λ¬Έμ μΌλ°μ μΌλ‘ stackoverflowμ λ μ ν©ν©λλ€.
λ€μ μ΄λ¦΄ κ²μ λλ€. λ¬Έμ λ«μ μ΄μ κ° μμ¬ μ€λ½λ€κ³ μκ°ν©λλ€.
ResizeObserver
APIμ λν μΈν°νμ΄μ€λ₯Ό μΆκ°νμ§ μλλ€λ μ μ λ λ μ΄μ μ¬μ©λμ§ μμΌλ©° μ
λ°μ΄νΈκ° νμν©λλ€.
/ cc @weswigham
@weswigham μ΄κ²μ λν μ λ°μ΄νΈκ° μμ΅λκΉ?
@weswigham MDNμ λ μ΄μμ΄ APIλ₯Ό μ€νμ©μΌλ‘ λμ΄νμ§ μμ΅λλ€. TypeScript 3.7.2μμ APIλ₯Ό μ¬μ©νλ €κ³ ν λ νμ¬ " 'ResizeObserver'μ΄λ¦μ μ°Ύμ μ μμ"μ΄ νμλ©λλ€.
μ΄ λ¬Έμ λ λ μ΄μ μ€νμ μ΄μ§ μκ³ λͺ¨λ μ£Όμ λΈλΌμ°μ μμ μ§μνλ―λ‘ λ€μ μ΄μ΄μΌν©λλ€.
MDNμ λ°λ₯΄λ©΄ μ¬μ ν νΈμ§μ μ΄μμ μΌλΆμΌ λΏμ΄λ©° λͺ¨λ μ£Όμ λΈλΌμ°μ κ°μ΄λ₯Ό μ§μνλ κ²μ μλλλ€.
λ¬Έμ λ₯Ό ν΄κ²°νκΈ° μ κΉμ§λ μ§μνμ§ μλ Safariκ°
2020 λ
μ 2020 λ
λ‘λ맡μ μμ΅λλ€. μ΄μ λν Edge μ§μμ΄ λ³΄μ₯λ©λλ€.
~ 1 μ 15 μΌ Edge Chromiumμ΄ μΌλ° λμ€μ μν΄ μΆμ λ μμ μ
λλ€.
ResizeObserverμ λν μ§μ.
2019 λ
11 μ 13 μΌ μμμΌ μ€μ 1:00 Martin Johns [email protected]
μΌλ€ :
MDNμ λ°λ₯΄λ©΄ μ¬μ ν νΈμ§μ μ΄μμ μΌλΆμ΄λ©° μ λΆλ μλλλ€.
μ£Όμ λΈλΌμ°μ μμ μ§μν©λλ€.β
λκΈμ λ¬μ κΈ° λλ¬Έμ μμ ν κ²μ λλ€.
μ΄ μ΄λ©μΌμ μ§μ λ΅μ₯νκ³ GitHubμμ νμΈνμΈμ.
https://github.com/microsoft/TypeScript/issues/28502?email_source=notifications&email_token=AAJKUOAOKN35DZEYT26M6VLQTO6ZVA5CNFSM4GDOB24KYY3PNVWWK3TUL52HS4DFVREXG43VMVORBW63LNGOW5MEZLOBW63LNGOWMVXHJK#63LNGOW53304678
λλ ꡬλ μ·¨μ
https://github.com/notifications/unsubscribe-auth/AAJKUODKUSZ7BORN3AUGNKLQTO6ZVANCNFSM4GDOB24A
.>
μΌλΉ λ‘μ λμ΄
[email protected] [email protected]
μ¬κΈ°μ μ λ°μ΄νΈκ° μμ΅λκΉ?
κ·Έκ²μ λ΄κ° λ§λ λ κΈ°κ΄΄ν λ¬Έμ μ€ νλμ λλ€. νμλ μλ μμ΄ APIμ λν΄ νμ΄ν μ€ν¬λ¦½νΈμ μ΅μνμ§ μκΈ° λλ¬Έμ λ§μ΄ λ€μμ΅λλ€.
κ±°μ 80 % https://caniuse.com/#search = ResizeObserver
μΆκ° ν μκ°μ΄ μ§λλ¬μ Safariλ‘ λ°°μ‘λμμ΅λλ€. μ΄κ²μ λ§ κ·Έλλ‘ λͺ¨λ λΈλΌμ°μ κ°μ΄λ₯Ό μ§μνλ€λ κ²μ μλ―Έν©λλ€.
μͺ½μΌλ‘
@weswigham , λ¬Έμ λ§λ€κΈ° https://github.com/microsoft/TSJS-lib-generator/issues/908
νμ΄νμ΄ μμ§ νμ΄ν μ€ν¬λ¦½νΈμ λ³ν©λμ§λ μμμ§λ§, ResizeObserver νμ΄νκ³Ό ν¨κ» npmμ ν¨ν€μ§λ₯Ό μ¬μ©ν μ μμ΅λλ€ : https://www.npmjs.com/package/@types/resize -observer-browser
@denexapp μ μλ΅μ μΆκ°νλ €λ©΄ :
1) https://www.npmjs.com/package/@types/resize-observer-browser μ€μΉ
2) νμΌ μλ¨μ /// <reference types="resize-observer-browser" />
μ (λ₯Ό) μ¬μ©ν΄μΌν©λλ€.
κ°μ₯ μ μ©ν λκΈ
μΆκ° ν μκ°μ΄ μ§λλ¬μ Safariλ‘ λ°°μ‘λμμ΅λλ€. μ΄κ²μ λ§ κ·Έλλ‘ λͺ¨λ λΈλΌμ°μ κ°μ΄λ₯Ό μ§μνλ€λ κ²μ μλ―Έν©λλ€.