Skip to content

Commit 769e253

Browse files
ahankinsonahankinson
authored
Merge pull request #567 from etosphere/fix/scope-injected-css
Fixed: Scope injected CSS to the viewer
2 parents 0d55149 + 840778e commit 769e253

15 files changed

Lines changed: 327 additions & 324 deletions

‎browser-tests/auth.spec.ts‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -230,7 +230,7 @@ test("loads only nearby sidebar thumbnails", async ({page}, testInfo) => {
230230
const initiallyLoaded = thumbnailRequests.size;
231231
expect(initiallyLoaded).toBeLessThan(pageCount);
232232

233-
await page.locator(".thumbs").evaluate((element) => { element.scrollTop = element.scrollHeight; });
233+
await page.locator(".diva-thumbs").evaluate((element) => { element.scrollTop = element.scrollHeight; });
234234
await expect.poll(() => thumbnailRequests.size).toBeGreaterThan(initiallyLoaded);
235235
});
236236

@@ -453,23 +453,23 @@ test("falls back from silent external auth and deduplicates active login", async
453453
await openHarness(page, `${origin}/mock/manifest`, testInfo);
454454
await expect(page.locator(".diva-auth-dialog")).toBeVisible();
455455
expect(externalTokenRequests).toBe(1);
456-
await expect(page.locator(".thumbs-image--protected")).toHaveCount(2);
456+
await expect(page.locator(".diva-thumbs-image--protected")).toHaveCount(2);
457457
await page.locator("button[data-diva-auth-flow]").click();
458458
await expect(page.locator(".diva-auth-dialog")).toBeHidden({timeout : 10000});
459459
await expect.poll(() => probeRequests.filter((request) => request.authorization === "Bearer token-1").length).toBe(1);
460460
await page.getByRole("button", {name : "Page View"}).click();
461-
await expect(page.locator(".modal.is-page-view")).toBeVisible();
461+
await expect(page.locator(".diva-modal.is-page-view")).toBeVisible();
462462
await expect.poll(() => infoRequests.get(`${origin}/mock/image-1/info.json`) || 0).toBe(1);
463463
await expect.poll(() => infoRequests.get(`${origin}/mock/image-2/info.json`) || 0).toBe(1);
464-
await expect(page.locator("img.thumbs-image").first()).toHaveAttribute("crossorigin", "use-credentials");
464+
await expect(page.locator("img.diva-thumbs-image").first()).toHaveAttribute("crossorigin", "use-credentials");
465465

466466
await page.evaluate(async ({sourceId, url}) => {
467467
const instance = (window as any).diva;
468468
await instance.auth.resolve({sourceId, url, isStatic : false}, new AbortController().signal);
469469
}, {sourceId : `${origin}/mock/image-1/info.json`, url : `${origin}/mock/image-1/info.json`});
470470
expect(infoRequests.get(`${origin}/mock/image-1/info.json`)).toBe(1);
471-
await page.locator(".modal-close-action button").click();
472-
await expect(page.locator(".modal.is-page-view")).toBeHidden();
471+
await page.locator(".diva-modal-close-action button").click();
472+
await expect(page.locator(".diva-modal.is-page-view")).toBeHidden();
473473

474474
await page.evaluate(async () => {
475475
const viewer = document.querySelector("osd-viewer") as any;
@@ -779,20 +779,20 @@ test("cancels superseded previews, source resolutions, and destroyed viewers", a
779779
await expect.poll(() => infoRequests).toBe(1);
780780

781781
await page.getByRole("button", {name : "Page View"}).click();
782-
await expect(page.locator(".modal.is-page-view")).toBeVisible();
783-
await page.locator(".modal-close-action button").click();
782+
await expect(page.locator(".diva-modal.is-page-view")).toBeVisible();
783+
await page.locator(".diva-modal-close-action button").click();
784784
await page.evaluate((id) => (window as any).diva.auth.invalidateSources([ id ]), sourceId);
785785
await page.getByRole("button", {name : "Page View"}).click();
786786
await expect.poll(() => infoRequests).toBe(2);
787-
await page.locator(".modal-close-action button").click();
787+
await page.locator(".diva-modal-close-action button").click();
788788
await expect.poll(() => page.evaluate(() => ({
789789
inflight : (window as any).diva.auth.inflight.size,
790790
pending : (window as any).diva.auth.pending.size,
791791
requests : (window as any).diva.auth.requests.size
792792
})))
793793
.toEqual({inflight : 0, pending : 0, requests : 0});
794794
releases.shift()?.();
795-
await expect(page.locator(".modal.is-page-view")).toBeHidden();
795+
await expect(page.locator(".diva-modal.is-page-view")).toBeHidden();
796796
await expect(page.locator(".diva-image-unavailable")).toHaveCount(0);
797797

798798
await page.evaluate(({id, url}) => {

‎browser-tests/public-api.spec.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -320,7 +320,7 @@ test("positions a distant initial image with final page geometry", async ({page}
320320
});
321321

322322
test("configures the initial sidebar width and retains the default", async ({page}) => {
323-
const sidebar = page.locator(".sidebar-panel");
323+
const sidebar = page.locator(".diva-sidebar-panel");
324324
await page.getByRole("button", {name : "Show Sidebar"}).evaluate((button: HTMLButtonElement) => button.click());
325325
await expect(sidebar).toHaveCSS("width", "320px");
326326

@@ -431,7 +431,7 @@ test("bolds ranges containing the current page in the contents index", async ({p
431431
await expect(sectionA).not.toHaveClass(/is-current/);
432432

433433
await page.getByRole("button", {name : "On this page"}).evaluate((button: HTMLButtonElement) => button.click());
434-
await expect(page.locator(".contents-button.is-current")).toHaveCount(0);
434+
await expect(page.locator(".diva-contents-button.is-current")).toHaveCount(0);
435435
});
436436

437437
test("bolds ranges containing either page of a two-up spread", async ({page}) => {
@@ -560,7 +560,7 @@ test("indents nested ranges in the contents index", async ({page}) => {
560560
expect(parentBox).not.toBeNull();
561561
expect(childBox!.x - parentBox!.x).toBeGreaterThanOrEqual(18);
562562
expect(grandchildBox!.x - childBox!.x).toBeGreaterThanOrEqual(18);
563-
await expect(page.locator(".contents-list-nested").first()).toHaveCSS("border-left-width", "1px");
563+
await expect(page.locator(".diva-contents-list-nested").first()).toHaveCSS("border-left-width", "1px");
564564
});
565565

566566
test("keeps the previous resource when a replacement request fails", async ({page}) => {

‎src/View.elm‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@ view model =
6262
, View.Sidebar.viewSidebarResizer model
6363
, View.Sidebar.viewSidebarPanel model
6464
]
65-
, div [ HA.class "required-statement-dock" ]
65+
, div [ HA.class "diva-required-statement-dock" ]
6666
[ viewMaybe (Lazy.lazy viewRequiredStatement) (requiredStatementTextFor model) ]
6767
, View.PageViewModal.viewPageViewModal model
6868
, View.ManifestInfoModal.viewManifestInfoModal model
@@ -177,7 +177,7 @@ viewRequiredStatement valueText =
177177

178178
else
179179
div
180-
[ HA.class "required-statement" ]
180+
[ HA.class "diva-required-statement" ]
181181
(HtmlRenderer.renderHtml valueText)
182182

183183

@@ -197,13 +197,13 @@ viewThrobber =
197197
]
198198
in
199199
div
200-
[ HA.class "throbber-overlay" ]
200+
[ HA.class "diva-throbber-overlay" ]
201201
[ div
202-
[ HA.class "throbber" ]
202+
[ HA.class "diva-throbber" ]
203203
(List.map
204204
(\delay ->
205205
div
206-
[ HA.class "throbber-cube"
206+
[ HA.class "diva-throbber-cube"
207207
, HA.style "animation-delay" (String.fromFloat delay ++ "s")
208208
]
209209
[]
@@ -216,16 +216,16 @@ viewThrobber =
216216
viewViewerStatusModal : ( String, String, Bool ) -> Html Msg
217217
viewViewerStatusModal ( titleText, message, isError ) =
218218
div
219-
[ HA.class "viewer-status-overlay" ]
219+
[ HA.class "diva-viewer-status-overlay" ]
220220
[ div
221-
[ HA.class "modal is-narrow" ]
221+
[ HA.class "diva-modal is-narrow" ]
222222
[ div
223-
[ HA.class "modal-header" ]
224-
[ div [ HA.class "modal-title" ] [ text titleText ] ]
223+
[ HA.class "diva-modal-header" ]
224+
[ div [ HA.class "diva-modal-title" ] [ text titleText ] ]
225225
, div
226-
[ HA.class "modal-body is-no-sidebar" ]
226+
[ HA.class "diva-modal-body is-no-sidebar" ]
227227
[ div
228-
[ classList [ ( "status", True ), ( "is-error", isError ) ] ]
228+
[ classList [ ( "diva-status", True ), ( "is-error", isError ) ] ]
229229
[ text message ]
230230
]
231231
]
@@ -234,7 +234,7 @@ viewViewerStatusModal ( titleText, message, isError ) =
234234

235235
viewZoomIndicator : String -> Html Msg
236236
viewZoomIndicator zoomText =
237-
div [ HA.class "viewer-zoom-indicator" ] [ text zoomText ]
237+
div [ HA.class "diva-viewer-zoom-indicator" ] [ text zoomText ]
238238

239239

240240
viewerStatus : Model -> Maybe ( String, String, Bool )

‎src/View/CollectionExplorer.elm‎

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ viewCollectionResizer model =
1919
ResourceLoadedCollection _ ->
2020
div
2121
[ classList
22-
[ ( "collection-resizer", True )
22+
[ ( "diva-collection-resizer", True )
2323
, ( "is-hidden", not model.collectionSidebarVisible )
2424
]
2525
, Events.on "mousedown"
@@ -64,7 +64,7 @@ viewCollectionPanel model collectionState =
6464
in
6565
div
6666
[ classList
67-
[ ( "collection-panel", True )
67+
[ ( "diva-collection-panel", True )
6868
, ( "is-fullscreen", model.fullscreen )
6969
, ( "is-hidden", not model.collectionSidebarVisible )
7070
]
@@ -77,18 +77,18 @@ viewCollectionPanel model collectionState =
7777
)
7878
]
7979
[ div
80-
[ HA.class "collection-header" ]
81-
[ div [ HA.class "collection-title" ] [ text labelText ]
80+
[ HA.class "diva-collection-header" ]
81+
[ div [ HA.class "diva-collection-title" ] [ text labelText ]
8282
, viewMaybe
8383
(\summary ->
84-
div [ HA.class "collection-summary" ] [ text (extractLabelFromLanguageMap model.detectedLanguage summary) ]
84+
div [ HA.class "diva-collection-summary" ] [ text (extractLabelFromLanguageMap model.detectedLanguage summary) ]
8585
)
8686
collection.summary
8787
]
8888
, div
89-
[ HA.class "sidebar-content" ]
89+
[ HA.class "diva-sidebar-content" ]
9090
[ div
91-
[ HA.class "sidebar-pane is-scroll" ]
91+
[ HA.class "diva-sidebar-pane is-scroll" ]
9292
[ viewCollectionTree model.detectedLanguage collectionState collection.items ]
9393
]
9494
]
@@ -97,7 +97,7 @@ viewCollectionPanel model collectionState =
9797
viewCollectionTree : Language -> CollectionState -> List CollectionItem -> Html Msg
9898
viewCollectionTree language collectionState items =
9999
ul
100-
[ HA.class "collection-list list-reset" ]
100+
[ HA.class "diva-collection-list diva-list-reset" ]
101101
(List.map (Lazy.lazy3 viewCollectionItem language collectionState) items)
102102

103103

@@ -113,8 +113,8 @@ viewManifestItem language collectionState manifest =
113113
li []
114114
[ button
115115
[ classList
116-
[ ( "manifest-tree-item", True )
117-
, ( "ui-button", True )
116+
[ ( "diva-manifest-tree-item", True )
117+
, ( "diva-ui-button", True )
118118
, ( "is-active", isActive )
119119
]
120120
, type_ "button"
@@ -148,7 +148,7 @@ viewNestedCollection language collectionState collection =
148148

149149
loadingView =
150150
if isLoading then
151-
[ div [ HA.class "contents-empty" ] [ text "Loading…" ] ]
151+
[ div [ HA.class "diva-contents-empty" ] [ text "Loading…" ] ]
152152

153153
else
154154
[]
@@ -159,13 +159,13 @@ viewNestedCollection language collectionState collection =
159159
[]
160160
in
161161
li
162-
[ HA.class "collection-tree-item" ]
162+
[ HA.class "diva-collection-tree-item" ]
163163
(button
164-
[ HA.class "collection-node-button ui-button"
164+
[ HA.class "diva-collection-node-button diva-ui-button"
165165
, type_ "button"
166166
, Events.onClick (UserClickedCollectionItem collection.id)
167167
]
168-
[ div [ HA.class "collection-expand-icon" ] [ text expandIcon ]
168+
[ div [ HA.class "diva-collection-expand-icon" ] [ text expandIcon ]
169169
, text labelText
170170
]
171171
:: childrenView

‎src/View/Helpers.elm‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ viewButtonWithAttributes extraAttrs config =
3333

3434
baseAttrs =
3535
[ classList
36-
[ ( "canvas-toolbar-button", True )
36+
[ ( "diva-canvas-toolbar-button", True )
3737
, ( "is-disabled", isDisabled )
3838
, ( "is-fullscreen", config.isFullscreen )
3939
]
@@ -49,7 +49,7 @@ viewButtonWithAttributes extraAttrs config =
4949
HA.disabled True :: (extraAttrs ++ baseAttrs)
5050
in
5151
div
52-
[ HA.class "canvas-toolbar-item"
52+
[ HA.class "diva-canvas-toolbar-item"
5353
, HA.attribute "data-tooltip" config.label
5454
]
5555
[ button buttonAttrs [ config.icon ]

‎src/View/ManifestInfoModal.elm‎

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -17,9 +17,9 @@ viewManifestInfoModal : Model -> Html Msg
1717
viewManifestInfoModal model =
1818
if model.manifestInfoOpen then
1919
div
20-
[ HA.class "modal-overlay" ]
20+
[ HA.class "diva-modal-overlay" ]
2121
[ div
22-
[ HA.class "modal is-narrow" ]
22+
[ HA.class "diva-modal is-narrow" ]
2323
[ viewHeader model
2424
, currentManifest model
2525
|> viewBody model
@@ -214,27 +214,27 @@ viewBody model maybeManifest =
214214
viewMaybe (viewLogoBlock model.detectedLanguage) maybeManifest
215215
in
216216
div
217-
[ HA.class "modal-body is-two-column" ]
217+
[ HA.class "diva-modal-body is-two-column" ]
218218
[ div
219-
[ HA.class "metadata-body" ]
219+
[ HA.class "diva-metadata-body" ]
220220
(List.map viewRow rows)
221221
, div
222-
[ HA.class "manifest-info-logo-wrap" ]
222+
[ HA.class "diva-manifest-info-logo-wrap" ]
223223
[ logoBlock ]
224224
]
225225

226226

227227
viewHeader : { a | fullscreen : Bool } -> Html Msg
228228
viewHeader { fullscreen } =
229229
div
230-
[ HA.class "modal-header" ]
230+
[ HA.class "diva-modal-header" ]
231231
[ div
232-
[ HA.class "modal-title" ]
232+
[ HA.class "diva-modal-title" ]
233233
[ text "Manifest Info" ]
234234
, div
235-
[ HA.class "modal-actions" ]
235+
[ HA.class "diva-modal-actions" ]
236236
[ div
237-
[ HA.class "modal-close-action" ]
237+
[ HA.class "diva-modal-close-action" ]
238238
[ viewButton
239239
{ label = "Close"
240240
, icon = Icons.close
@@ -275,7 +275,7 @@ viewLogoBlock language manifest =
275275
[ viewMaybe
276276
(\url ->
277277
img
278-
[ HA.class "manifest-info-logo"
278+
[ HA.class "diva-manifest-info-logo"
279279
, src url
280280
, alt "Manifest logo"
281281
]
@@ -305,9 +305,9 @@ viewLogoBlock language manifest =
305305
viewRow : ( String, Html Msg ) -> Html Msg
306306
viewRow ( labelText, valueNode ) =
307307
div
308-
[ HA.class "metadata-item" ]
309-
[ div [ HA.class "metadata-label" ] [ text labelText ]
310-
, div [ HA.class "metadata-value" ] [ valueNode ]
308+
[ HA.class "diva-metadata-item" ]
309+
[ div [ HA.class "diva-metadata-label" ] [ text labelText ]
310+
, div [ HA.class "diva-metadata-value" ] [ valueNode ]
311311
]
312312

313313

0 commit comments

Comments
 (0)