Bug: Highlighting selection on active line doesn't work

[notmedia]

Hi! The problem here is that when you setup selection color it doesn't highlight selection on active line. For default theme it works.

In this example I selected '#4D4D4C', string, you can see that match selection worked.

[jaywcjlove]

react-codemirror/www/src/pages/theme/editor/index.tsx

Lines 75 to 86 in 09521dd

	const [settings, setSettings] = useState<CreateThemeOptions['settings']>({
	background: '#ffffff',
	foreground: '#4D4D4C',
	caret: '#AEAFAD',
	selection: '#D6D6D6',
	selectionMatch: '#D6D6D6',
	gutterBackground: '#FFFFFF',
	gutterForeground: '#4D4D4C',
	gutterBorder: '#ddd',
	gutterActiveForeground: '',
	lineHighlight: '#EFEFEF',
	});

@notmedia I found no errors.

[notmedia]

@jaywcjlove Hey! Try to select text on active line, you may see that selection is invisible there

[jaywcjlove]

I fixed it. @notmedia Upgrade v4.14.2

[notmedia]

@jaywcjlove Hi! Thank you, but I found another bug here.
If you define selection color and lineHighlight color then selection is also invisible on active line.
So the lineHighlight overrides it.

[jaywcjlove]

https://codesandbox.io/embed/codemirror-uiwjs-react-codemirror-issues-406-s6m8mc?fontsize=14&hidenavigation=1&theme=dark

I created a new codemirror example to test it. Looks fine.

selection word, lineHighlight hides

Maybe I didn't understand your question.

@notmedia

[notmedia]

@jaywcjlove I took a video

Screen.Recording.2022-11-18.at.16.40.00.mov

[jaywcjlove]

I understand, I see the official solution is to set the transparent background color.

@notmedia

[notmedia]

@jaywcjlove But on official webpage it works as expected(

Screen.Recording.2022-11-18.at.17.30.16.mov

[jaywcjlove]

@notmedia using a transparent color

[notmedia]

@jaywcjlove Yeah, it works! Thank you :)

[elitenas]

I think the bug here is that if the text is selected... the activeLine class should be removed. This bug was introduced after 4.11.6

[notmedia]

No, because you need to see active line in selection if you select multiple lines

[elitenas]

if we set activeLine to transparent to see the highlight or selection then we dont see which line is active ever