search

kolide / fleet

A flexible control server for osquery fleets
https://kolide.com/fleet
MIT License
1.1k stars 261 forks source link

Query editor behaves strangely in Safari #1324

Open zwass opened 7 years ago

zwass commented 7 years ago

Strange rendering while typing

editor editor2

terracatta commented 7 years ago

@zwass can you further clarify the strange behavior you're seeing?

zwass commented 7 years ago

The cursor is to the left of the actual text when editing.

kyleknighted commented 7 years ago

So the core AceEditor works on Safari, but we're using a library called react-ace, which in turn uses Brace, which calls in Ace. I am able to repro this issue on Safari in our app, but I don't think I have a solution for it because the way it's handled is all buried in the library itself and isn't something we can control from what I can tell.

@mikestone14 May have additional insight, but Safari is trash and is never updated, wouldn't hurt my feelings any to kill off support for it, because it seems like Apple has just about done the same thing.

zwass commented 7 years ago

IMO this is not an issue we should spend a ton of time on at this point. The editor will still "work", just with funkiness.

mwild1 commented 5 years ago

For the record I'm seeing similar issues on Firefox 64, Ubuntu.

mwild1 commented 5 years ago

Further research:

It looks like the issue is https://github.com/ajaxorg/ace/issues/460 - in summary, that Ace only supports monospaced fonts.

I see the current CSS rule is for 'Source Code Pro', monospace. It looks like Source Code Pro is monospace, and Firefox claims to be using it for that element - so it should work. But if I change the rule to just monospace it loads 'Deja Vu Sans Mono' instead and suddenly the glitches are fixed.

mwild1 commented 5 years ago

I've tried to prepare various fixes based on the insightful discussion over at another project that experiences this issue: https://github.com/contao/core/issues/7103

However so far I haven't been able to make it work, except for this patch:

diff --git a/frontend/components/KolideAce/theme.css b/frontend/components/KolideAce/theme.css
index 3a21e048..b3bb3099 100644
--- a/frontend/components/KolideAce/theme.css
+++ b/frontend/components/KolideAce/theme.css
@@ -1,5 +1,4 @@
 .ace_editor.ace-kolide {
-  font-family: 'SourceCodePro', monospace;
   font-size: 14px;
   background-color: #fcfcff;
   color: #66696f;

On my machine this causes it to then use Ubuntu Mono and everything is fine. I believe this comes from Ace's default font-family rule (which I'll note also includes SourceCodePro).

polak785 commented 5 years ago

Hello,

I have this behavior too on Firefox 70 (Ubuntu 19.04) and with the latest Kolide Fleet version.

You still don't have plan nor time to fix this ?

Rylon commented 4 years ago

Just to add I also have this issue in Safari (13.1.1) on macOS Catalina 10.15.5, but it seems to be fixed in Firefox (79), did anyone figure out a workaround or fix for it?