Skip to content
This repository was archived by the owner on Nov 25, 2021. It is now read-only.

Commit 0e39c9b

Browse files
chrismwendtchrismwendt
authored
feat: conditionally tokenize cells (#115)
1 parent 2b3a30e commit 0e39c9b

File tree

3 files changed

+57
-19
lines changed

3 files changed

+57
-19
lines changed

‎src/hoverifier.test.ts‎

Lines changed: 18 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ describe('Hoverifier', () => {
5050

5151
const positionJumps = new Subject<PositionJump>()
5252

53-
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents(codeView))
53+
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents({ domFunctions: codeView }))
5454

5555
const subscriptions = new Subscription()
5656

@@ -112,7 +112,7 @@ describe('Hoverifier', () => {
112112

113113
const positionJumps = new Subject<PositionJump>()
114114

115-
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents(codeView))
115+
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents({ domFunctions: codeView }))
116116

117117
const subscriptions = new Subscription()
118118

@@ -201,7 +201,7 @@ describe('Hoverifier', () => {
201201

202202
const positionJumps = new Subject<PositionJump>()
203203

204-
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents(codeView))
204+
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents({ domFunctions: codeView }))
205205

206206
const subscriptions = new Subscription()
207207

@@ -282,7 +282,7 @@ describe('Hoverifier', () => {
282282

283283
const positionJumps = new Subject<PositionJump>()
284284

285-
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents(codeView))
285+
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents({ domFunctions: codeView }))
286286

287287
const subscriptions = new Subscription()
288288

@@ -346,7 +346,9 @@ describe('Hoverifier', () => {
346346

347347
const positionJumps = new Subject<PositionJump>()
348348

349-
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents(codeView))
349+
const positionEvents = of(codeView.codeView).pipe(
350+
findPositionsFromEvents({ domFunctions: codeView })
351+
)
350352

351353
const subscriptions = new Subscription()
352354

@@ -416,7 +418,9 @@ describe('Hoverifier', () => {
416418

417419
const positionJumps = new Subject<PositionJump>()
418420

419-
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents(codeView))
421+
const positionEvents = of(codeView.codeView).pipe(
422+
findPositionsFromEvents({ domFunctions: codeView })
423+
)
420424

421425
const subscriptions = new Subscription()
422426

@@ -495,7 +499,7 @@ describe('Hoverifier', () => {
495499

496500
const positionJumps = new Subject<PositionJump>()
497501

498-
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents(codeView))
502+
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents({ domFunctions: codeView }))
499503

500504
const subscriptions = new Subscription()
501505

@@ -567,7 +571,7 @@ describe('Hoverifier', () => {
567571

568572
const positionJumps = new Subject<PositionJump>()
569573

570-
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents(codeView))
574+
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents({ domFunctions: codeView }))
571575

572576
const subscriptions = new Subscription()
573577

@@ -629,7 +633,7 @@ describe('Hoverifier', () => {
629633

630634
const positionJumps = new Subject<PositionJump>()
631635

632-
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents(codeView))
636+
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents({ domFunctions: codeView }))
633637

634638
const subscriptions = new Subscription()
635639

@@ -712,7 +716,7 @@ describe('Hoverifier', () => {
712716

713717
const positionJumps = new Subject<PositionJump>()
714718

715-
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents(codeView))
719+
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents({ domFunctions: codeView }))
716720

717721
const subscriptions = new Subscription()
718722

@@ -766,7 +770,7 @@ describe('Hoverifier', () => {
766770
pinningEnabled: true,
767771
})
768772
const positionJumps = new Subject<PositionJump>()
769-
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents(codeView))
773+
const positionEvents = of(codeView.codeView).pipe(findPositionsFromEvents({ domFunctions: codeView }))
770774

771775
const codeViewSubscription = hoverifier.hoverify({
772776
dom: codeView,
@@ -807,7 +811,9 @@ describe('Hoverifier', () => {
807811
pinningEnabled: true,
808812
})
809813
const positionJumps = new Subject<PositionJump>()
810-
const positionEvents = of(codeViewProps.codeView).pipe(findPositionsFromEvents(codeViewProps))
814+
const positionEvents = of(codeViewProps.codeView).pipe(
815+
findPositionsFromEvents({ domFunctions: codeViewProps })
816+
)
811817

812818
const codeViewSubscription = hoverifier.hoverify({
813819
dom: codeViewProps,

‎src/positions.test.ts‎

Lines changed: 27 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { filter, map } from 'rxjs/operators'
44
import { TestScheduler } from 'rxjs/testing'
55

66
import { CodeViewProps, DOM } from './testutils/dom'
7-
import { dispatchMouseEventAtPositionImpure } from './testutils/mouse'
7+
import { createMouseEvent, dispatchMouseEventAtPositionImpure } from './testutils/mouse'
88

99
import { propertyIsDefined } from './helpers'
1010
import { findPositionsFromEvents } from './positions'
@@ -43,7 +43,7 @@ describe('positions', () => {
4343
}
4444

4545
const clickedTokens = of(codeView.codeView).pipe(
46-
findPositionsFromEvents(codeView),
46+
findPositionsFromEvents({ domFunctions: codeView }),
4747
filter(propertyIsDefined('position')),
4848
map(({ position: { line, character } }) => ({ line, character }))
4949
)
@@ -56,4 +56,29 @@ describe('positions', () => {
5656
})
5757
}
5858
})
59+
60+
for (const tokenize of [false, true]) {
61+
for (const codeView of testcases) {
62+
it((tokenize ? 'tokenizes' : 'does not tokenize') + ` the DOM when tokenize: ${tokenize}`, () => {
63+
of(codeView.codeView)
64+
.pipe(findPositionsFromEvents({ domFunctions: codeView, tokenize }))
65+
.subscribe()
66+
67+
const htmlBefore = codeView.getCodeElementFromLineNumber(codeView.codeView, 5)!.outerHTML
68+
codeView.getCodeElementFromLineNumber(codeView.codeView, 5)!.dispatchEvent(
69+
createMouseEvent('mouseover', {
70+
x: 0,
71+
y: 0,
72+
})
73+
)
74+
const htmlAfter = codeView.getCodeElementFromLineNumber(codeView.codeView, 5)!.outerHTML
75+
76+
if (tokenize) {
77+
chai.expect(htmlBefore).to.not.equal(htmlAfter)
78+
} else {
79+
chai.expect(htmlBefore).to.equal(htmlAfter)
80+
}
81+
})
82+
}
83+
}
5984
})

‎src/positions.ts‎

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -26,9 +26,13 @@ export interface PositionEvent {
2626
}
2727

2828
export { DOMFunctions, DiffPart }
29-
export const findPositionsFromEvents = (options: DOMFunctions) => (
30-
elements: Subscribable<HTMLElement>
31-
): Observable<PositionEvent> =>
29+
export const findPositionsFromEvents = ({
30+
domFunctions,
31+
tokenize = true,
32+
}: {
33+
domFunctions: DOMFunctions
34+
tokenize?: boolean
35+
}) => (elements: Subscribable<HTMLElement>): Observable<PositionEvent> =>
3236
merge(
3337
from(elements).pipe(
3438
switchMap(element =>
@@ -46,7 +50,10 @@ export const findPositionsFromEvents = (options: DOMFunctions) => (
4650
// If not done for this cell, wrap the tokens in this cell to enable finding the precise positioning.
4751
// This may be possible in other ways (looking at mouse position and rendering characters), but it works
4852
tap(({ target }) => {
49-
const code = options.getCodeElementFromTarget(target)
53+
if (!tokenize) {
54+
return
55+
}
56+
const code = domFunctions.getCodeElementFromTarget(target)
5057
if (code) {
5158
convertCodeElementIdempotent(code)
5259
}
@@ -72,7 +79,7 @@ export const findPositionsFromEvents = (options: DOMFunctions) => (
7279
).pipe(
7380
// Find out the position that was hovered over
7481
map(({ target, codeView, ...rest }) => {
75-
const hoveredToken = locateTarget(target, options)
82+
const hoveredToken = locateTarget(target, domFunctions)
7683
const position = isPosition(hoveredToken) ? hoveredToken : undefined
7784
return { position, codeView, ...rest }
7885
})

0 commit comments

Comments
 (0)