Jsdom: Element.closest() ์ง€์›

์— ๋งŒ๋“  2016๋…„ 07์›” 07์ผ  ยท  8์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: jsdom/jsdom

์—ฌ๋Ÿฌ๋ถ„, jsdom์—์„œ Element.closest() ๋ฅผ ์ง€์›ํ•  ๊ณ„ํš์ด ์žˆ๋Š”์ง€ ๊ถ๊ธˆํ•ฉ๋‹ˆ๋‹ค.

dom living standard feature selectors

๊ฐ€์žฅ ์œ ์šฉํ•œ ๋Œ“๊ธ€

๋ถˆํ–‰ํžˆ๋„ ์ง€๊ธˆ์€ jsdom ์ฝ”๋“œ ๋ฒ ์ด์Šค๋ฅผ ํŒŒํ—ค์น˜๊ณ  ์ดํ•ดํ•  ์‹œ๊ฐ„์ด ์—†์ง€๋งŒ ๋‹ค์Œ ์Šค๋‹ˆํŽซ๋งŒ ์žˆ์œผ๋ฉด ๋ฉ๋‹ˆ๋‹ค.

window.Element.prototype.closest = function (selector) {
    var el = this;
    while (el) {
        if (el.matches(selector)) {
            return el;
        }
        el = el.parentElement;
    }
};

์ด๋ฏธ ํ”„๋กœ์ ํŠธ์— ์ฐธ์—ฌํ•˜๊ณ  ์žˆ๋Š” ๋ˆ„๊ตฐ๊ฐ€๊ฐ€ ์ ์ ˆํ•œ ์œ„์น˜์— ์ด๋ฅผ ๋„ฃ์„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

๋ชจ๋“  8 ๋Œ“๊ธ€

์กด์žฌํ•˜์ง€ ์•Š๋Š” Element.closest๋ฅผ ์ง€์›ํ•  ๊ณ„ํš์ด ์—†์Šต๋‹ˆ๋‹ค. ๊ทธ๋Ÿฌ๋‚˜ Element.prototype.closest๋Š” ํ–ฅํ›„ ์ง€์›์„ ์‹œ๋„ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ํ’€ ๋ฆฌํ€˜์ŠคํŠธ๋Š” ์•ž์œผ๋กœ ์ž‘์—…์„ ์ง„ํ–‰ํ•˜๋Š” ๊ฐ€์žฅ ์ข‹์€ ๋ฐฉ๋ฒ•์ด ๋  ๊ฒƒ์ž…๋‹ˆ๋‹ค.

@domenic Element.prototype.closest ๋Š” ์œ„์—์„œ ๋งํฌํ•œ ๊ฒƒ๊ณผ ๋‹ค๋ฅธ๊ฐ€์š”? ๊ทธ ์ด์™ธ์˜ ํ•ด๋‹น MDN ๊ธฐ์‚ฌ๋ฅผ ์ฐพ์„ ์ˆ˜ ์—†์Šต๋‹ˆ๋‹ค.

MDN์ด ํ˜ผ๋ž€์Šค๋Ÿฝ๋‹ค๊ณ  ์ƒ๊ฐํ•ฉ๋‹ˆ๋‹ค. ๊ทธ๋Ÿฌ๋‚˜ ๋ธŒ๋ผ์šฐ์ €(๋˜๋Š” ์‚ฌ์–‘)๋ฅผ ํ™•์ธํ•˜๋ฉด Element.closest === undefined ์ธ ๋ฐ˜๋ฉด Element.prototype.closest ๋Š” ํ•จ์ˆ˜์ž…๋‹ˆ๋‹ค.

์•„, ๊ทธ๋ž˜์š”. ์ง„์‹ฌ์ด ์•„๋‹ˆ์—ˆ์„ ๊ฑฐ๋ผ ํ™•์‹ ํ•˜์ง€๋งŒ, ๋‹น์‹ ์˜ ์ดˆ๊ธฐ ๋ฐ˜์‘์€ ๊ทธ ์ฐจ์ด๋ฅผ ๋ชฐ๋ผ์„œ ๋ฉ์ฒญํ•œ ์‚ฌ๋žŒ์ฒ˜๋Ÿผ ๋Š๊ปด์กŒ๊ณ , ๊ทธ๊ฒƒ์ด ์ด ์ปค๋ฎค๋‹ˆํ‹ฐ๋ฅผ ๋Œ€ํ‘œํ•˜์ง€ ์•Š๊ธฐ๋ฅผ ๋ฐ”๋ž๋‹ˆ๋‹ค. ๊ธฐ์—ฌํ•  ๋งŒํผ ์ถฉ๋ถ„ํžˆ ์ดํ•ดํ–ˆ๋Š”์ง€ ํ™•์ธํ•˜๊ธฐ ์œ„ํ•ด jsdom ์ฝ”๋“œ๋ฅผ ์ž์„ธํžˆ ์‚ดํŽด๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค.

๋ถˆํ–‰ํžˆ๋„ ์ง€๊ธˆ์€ jsdom ์ฝ”๋“œ ๋ฒ ์ด์Šค๋ฅผ ํŒŒํ—ค์น˜๊ณ  ์ดํ•ดํ•  ์‹œ๊ฐ„์ด ์—†์ง€๋งŒ ๋‹ค์Œ ์Šค๋‹ˆํŽซ๋งŒ ์žˆ์œผ๋ฉด ๋ฉ๋‹ˆ๋‹ค.

window.Element.prototype.closest = function (selector) {
    var el = this;
    while (el) {
        if (el.matches(selector)) {
            return el;
        }
        el = el.parentElement;
    }
};

์ด๋ฏธ ํ”„๋กœ์ ํŠธ์— ์ฐธ์—ฌํ•˜๊ณ  ์žˆ๋Š” ๋ˆ„๊ตฐ๊ฐ€๊ฐ€ ์ ์ ˆํ•œ ์œ„์น˜์— ์ด๋ฅผ ๋„ฃ์„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

๊ทธ ํ•˜๋‚˜๊ฐ€ ์ด์ œ ํ์‡„๋˜์—ˆ์œผ๋ฏ€๋กœ https://github.com/tmpvar/jsdom/pull/1951 ์ด

์•„์ง jsdom์— ์žˆ์ง€ ์•Š์Šต๋‹ˆ๊นŒ?

์ด๊ฒƒ์€ v11.12.0์—์„œ https://github.com/jsdom/jsdom/pull/1951 ์„ ๋ณ‘ํ•ฉํ•˜์—ฌ ์ˆ˜์ •๋˜์—ˆ์Šต๋‹ˆ๋‹ค ๐ŸŽ‰

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰