Dropdown style inconsistent

[hepcat72]

BUG DESCRIPTION

Problem

For some reason, the dropdown menus on the dev site are rendered differently from those rendered on the production site. The reason for this is unknown and unmanaged. Not sure if this is just for the advanced search page or other pages too.

Steps to reproduce

1. Go to the advanced search page

Current behavior

Expected behavior

Both sites should intentionally render the dropdowns in the same style, consistent with the browser (not regardless of the browser).

Suggested Change

None provided

Comment

None

---

ISSUE OWNER SECTION

Assumptions

1. List of assumptions made WRT the code
2. E.g. We will assume input is correct (explaining why there is no validation)

Limitations

1. A list of things this work will specifically not do
2. E.g. This feature will only handle the most frequent use case X

Affected Components

• change: File path or DB table ...
• add: Environment variable or server setting
• delete: External executable or cron job

Requirements

• [ ] 1. List of numbered conditions to be met for the feature
• [ ] 2. E.g. Every column/row must display a value, i.e. cannot be empty
• [ ] 3. Numbers for reference & checkboxes for progress tracking

DESIGN

GUI Change description

None provided

Code Change Description

None provided

Tests

• [ ] 1. A description of at least one test for each requirement above.
• [ ] 2. E.g. Test for req 2 that there's an exception when display value is ''
• [ ] 3. Numbers for reference & checkboxes for progress tracking

[hepcat72]

I looked into this today after deploying 3.1.1-beta on dev and it appears that the style seems to differ based on Safari browser version

• Safari 15.6.1 appears more modern with blue carets, and a flat white menu
• Safari 17.4.1 appears outdated with a grayscale gradient and black carets

I posted on stack about it because I could not find any code changes to explain it:

https://stackoverflow.com/questions/79189882/what-explains-the-difference-in-this-default-safari-form-css-styling

[jcmatese]

Uncertain, but I did see this which had this jsfiddle example which changed the style on hover?

[jcmatese]

Also some comment about "Safari will ignore your custom value if it doesn’t meet a certain threshold"

[hepcat72]

Those are interesting, for sure, but it's the same code displayed differently on 2 safari versions, and the more modern Safari shows the outdated looking style and the old safari shows the more modern style. What search terms did you use to find those pages, BTW, because I'm clearly not using sufficient search terms - I found nothing.

[jcmatese]

I think I searched first with

safari blue arrows dropdown menus

(with minor success?) and then because it seems there might be a version issue, I tried

safari now respects select background-color version log safari now respects select background-color

(with minor success?) and so I tried to restrict it

"safari" "select" "menu" "background-color"

but I think things started to dry up a little, and perhaps background-color is a red herring