Skip to content

Commit

Permalink
Build: cleaner, smaller build output; single CSS file using data attr…
Browse files Browse the repository at this point in the history 
…ibutes now
  • Loading branch information
@rpearce
rpearce committed Mar 3, 2020
1 parent 8544df6 commit 050ad94
Show file tree
Hide file tree
Showing 33 changed files with 187 additions and 199 deletions.
2 changes: 1 addition & 1 deletion __tests__/Uncontrolled.js
View file
Expand Up @@ -216,7 +216,7 @@ test('passes on original transform style', () => {
jest.advanceTimersByTime(300)
})

const wrapEl = modal.querySelector('.content')
const wrapEl = modal.querySelector('[data-rmiz-modal-content]')
expect(wrapEl.style.transform).toContain('rotate(45deg)')

expect(document.body).toMatchSnapshot()
Expand Down
60 changes: 30 additions & 30 deletions __tests__/__snapshots__/Controlled.js.snap
View file
Expand Up @@ -4,7 +4,7 @@ exports[`custom open/close text 1`] = `
<body>
<div>
<div
class="wrap"
data-rmiz-wrap="visible"
>
<img
alt="foo"
Expand All @@ -13,7 +13,7 @@ exports[`custom open/close text 1`] = `
/>
<button
aria-label="Open me"
class="trigger btn"
data-rmiz-btn-open="true"
type="button"
/>
</div>
Expand All @@ -25,7 +25,7 @@ exports[`custom open/close text 2`] = `
<body>
<div>
<div
class="wrapHidden"
data-rmiz-wrap="hidden"
>
<img
alt="foo"
Expand All @@ -34,19 +34,19 @@ exports[`custom open/close text 2`] = `
/>
<button
aria-label="Open me"
class="trigger btn"
data-rmiz-btn-open="true"
type="button"
/>
</div>
</div>
<div
aria-modal="true"
class="overlay"
data-rmiz-overlay="true"
role="dialog"
style="background-color: rgba(255, 255, 255, 0.95); transition-duration: 300ms; z-index: 2147483647;"
>
<div
class="content"
data-rmiz-modal-content="true"
style="height: 0px; left: 0px; top: 0px; transform: scale(Infinity) translate(0px, 0px); transition-duration: 300ms; width: 0px;"
>
<img
Expand All @@ -57,7 +57,7 @@ exports[`custom open/close text 2`] = `
</div>
<button
aria-label="Close me"
class="trigger btn"
data-rmiz-btn-close="true"
type="button"
/>
</div>
Expand All @@ -67,7 +67,7 @@ exports[`custom open/close text 2`] = `
exports[`renders without browser environment 1`] = `
<body>
<div
class="wrap"
data-rmiz-wrap="visible"
>
<img
alt="foo"
Expand All @@ -76,7 +76,7 @@ exports[`renders without browser environment 1`] = `
/>
<button
aria-label="Zoom image"
class="trigger btn"
data-rmiz-btn-open="true"
type="button"
/>
</div>
Expand All @@ -87,7 +87,7 @@ exports[`when closed and then open 1`] = `
<body>
<div>
<div
class="wrap"
data-rmiz-wrap="visible"
>
<img
alt="foo"
Expand All @@ -96,7 +96,7 @@ exports[`when closed and then open 1`] = `
/>
<button
aria-label="Zoom image"
class="trigger btn"
data-rmiz-btn-open="true"
type="button"
/>
</div>
Expand All @@ -108,7 +108,7 @@ exports[`when closed and then open 2`] = `
<body>
<div>
<div
class="wrapHidden"
data-rmiz-wrap="hidden"
>
<img
alt="foo"
Expand All @@ -117,19 +117,19 @@ exports[`when closed and then open 2`] = `
/>
<button
aria-label="Zoom image"
class="trigger btn"
data-rmiz-btn-open="true"
type="button"
/>
</div>
</div>
<div
aria-modal="true"
class="overlay"
data-rmiz-overlay="true"
role="dialog"
style="background-color: rgba(255, 255, 255, 0.95); transition-duration: 300ms; z-index: 2147483647;"
>
<div
class="content"
data-rmiz-modal-content="true"
style="height: 0px; left: 0px; top: 0px; transform: scale(Infinity) translate(0px, 0px); transition-duration: 300ms; width: 0px;"
>
<img
Expand All @@ -140,7 +140,7 @@ exports[`when closed and then open 2`] = `
</div>
<button
aria-label="Unzoom image"
class="trigger btn"
data-rmiz-btn-close="true"
type="button"
/>
</div>
Expand All @@ -151,7 +151,7 @@ exports[`when closed and then open 3`] = `
<body>
<div>
<div
class="wrapHidden"
data-rmiz-wrap="hidden"
>
<img
alt="foo"
Expand All @@ -160,19 +160,19 @@ exports[`when closed and then open 3`] = `
/>
<button
aria-label="Zoom image"
class="trigger btn"
data-rmiz-btn-open="true"
type="button"
/>
</div>
</div>
<div
aria-modal="true"
class="overlay"
data-rmiz-overlay="true"
role="dialog"
style="background-color: rgba(255, 255, 255, 0); transition-duration: 300ms; z-index: 2147483647;"
>
<div
class="content"
data-rmiz-modal-content="true"
style="height: 0px; left: 0px; top: 0px; transform: scale(1) translate(0, 0); transition-duration: 300ms; width: 0px;"
>
<img
Expand All @@ -183,7 +183,7 @@ exports[`when closed and then open 3`] = `
</div>
<button
aria-label="Unzoom image"
class="trigger btn"
data-rmiz-btn-close="true"
type="button"
/>
</div>
Expand All @@ -194,7 +194,7 @@ exports[`when closed and then open 4`] = `
<body>
<div>
<div
class="wrap"
data-rmiz-wrap="visible"
>
<img
alt="foo"
Expand All @@ -203,7 +203,7 @@ exports[`when closed and then open 4`] = `
/>
<button
aria-label="Zoom image"
class="trigger btn"
data-rmiz-btn-open="true"
type="button"
/>
</div>
Expand All @@ -215,7 +215,7 @@ exports[`when open and then closed 1`] = `
<body>
<div>
<div
class="wrapHidden"
data-rmiz-wrap="hidden"
>
<img
alt="foo"
Expand All @@ -224,19 +224,19 @@ exports[`when open and then closed 1`] = `
/>
<button
aria-label="Zoom image"
class="trigger btn"
data-rmiz-btn-open="true"
type="button"
/>
</div>
</div>
<div
aria-modal="true"
class="overlay"
data-rmiz-overlay="true"
role="dialog"
style="background-color: rgba(255, 255, 255, 0); transition-duration: 300ms; z-index: 2147483647;"
>
<div
class="content"
data-rmiz-modal-content="true"
style="height: 0px; left: 0px; top: 0px; transform: scale(1) translate(0, 0); transition-duration: 300ms; width: 0px;"
>
<img
Expand All @@ -247,7 +247,7 @@ exports[`when open and then closed 1`] = `
</div>
<button
aria-label="Unzoom image"
class="trigger btn"
data-rmiz-btn-close="true"
type="button"
/>
</div>
Expand All @@ -258,7 +258,7 @@ exports[`when open and then closed 2`] = `
<body>
<div>
<div
class="wrap"
data-rmiz-wrap="visible"
>
<img
alt="foo"
Expand All @@ -267,7 +267,7 @@ exports[`when open and then closed 2`] = `
/>
<button
aria-label="Zoom image"
class="trigger btn"
data-rmiz-btn-open="true"
type="button"
/>
</div>
Expand Down
6 changes: 3 additions & 3 deletions __tests__/__snapshots__/ControlledActivated.test.js.snap
View file
Expand Up @@ -5,12 +5,12 @@ exports[`uses pseudo-parent when no parentRef.current 1`] = `
<div />
<div
aria-modal="true"
class="overlay"
data-rmiz-overlay="true"
role="dialog"
style="background-color: rgba(255, 255, 255, 0.95); transition-duration: 300ms; z-index: 2147483647;"
>
<div
class="content"
data-rmiz-modal-content="true"
style="height: 0px; left: 0px; top: 0px; transform: scale(Infinity) translate(0px, 0px); transition-duration: 300ms; width: 0px;"
>
<img
Expand All @@ -21,7 +21,7 @@ exports[`uses pseudo-parent when no parentRef.current 1`] = `
</div>
<button
aria-label="Unzoom image"
class="trigger btn"
data-rmiz-btn-close="true"
/>
</div>
</body>
Expand Down

0 comments on commit 050ad94

Please sign in to comment.