Search field showing over dialog in staging and production but not in dev

Hello!
I have encountered an issue where my search field in a view is showing through an open dialog in staging and in production, but it is not the case in dev. Have tried to stage the environment again, but it continues to happen. Se the attached photos. Any ideas on what might be the case here? (have double checked that the z-index is set to zero)

This is the dev environment:

Here is the prod and staging:


Hi Mina,

I will need some more context on this to be able to help you. How does it look in Create? Where are the input field components placed? Are they in the view behind the dialog, or are they placed in the dialog? What are the visibility conditions of the input fields?

Hi Isabel!

The component showing through are in the view in witch the dialog is overlaying. The input field do not have any specific visibility conditions. Find it difficult to test as has always looked fine in development environment, only occur in prod and stage.

This is what it looks like in create, and this component is placed on depth 3 of containers:
image

Thank you for the context!

What versions of Create are you running in Dev and Staging? (This can be found in Dev tools, under settings and Version Information).

Under Version Information I have this:
image

1 Like

image
This is from Staging^ It is the same version and branch and in Dev.

1 Like

Thank you!

Does the issue apply to several users, or only to 1 person? And when did it occur?

The issue applies to several users. It was first detected February 15, 2024 at 9:45 AM. However, now the bug only appear in Production. It does not appear in Staging anymore. I find this weird, because we have not deployed to Staging. So, the version is the same as I sent earlier.

Note that the model we deployed to Staging is the same model we deployed to Production.

Ok,

Sounds like some edge case cache issue, but very hard to figure out with only this case in production.

Are you using any coded component or run code that is manipulating CSS or DOM-tree?

You may also try a new deploy (best with some data related changes, such as adding and removing a datasource) and report back if it helps? And naybe also to inspect the html on in staging vs production to see if there are any differences related to that search box.

The following pictures illustrate the container wrapping the component that shows through the dialog and the connected css as viewed in the console.
Played around with the css and found out that when I turn off the Display: flex on the container, it does not show through anymore. Don’t understand why this is the case.

image
image

Very strange.

Turning flex on and off, does the problem reappear? And is the problem visible in Dev environment? If that is the case, you may DM with instructions for how to locate this problem in the App.

The problem does not appear in the dev environment