Background color from mention hides on google chrome

[Nichtmetall]

Steps to reproduce:

1. Create React Mention Component
2. Insert some mention for suggestion box in Windows Google Chrome
3. Reload Page
4. Write something new ine Mention input

Expected behaviour: Background-Color of mentions should be still there on previous and on new mention.

Observed behaviour: Background-Color hides on all mentions, there are only visable on reload.

Before:

While writing:

After reload:

Workaround: Use another browser like Edge. There it does work perfectly.

This is my component:

import { Interface } from "node:readline/promises";
import * as React from "react";
import { MentionsInput, Mention, SuggestionDataItem } from 'react-mentions'

interface IMentionInputProps {
  value: string,
  onChange: (e: any) => void,
  readonly: boolean,
  data: SuggestionDataItem[],
}

export const MentionInput = (props: IMentionInputProps) => {

  return (
      <MentionsInput readOnly={props.readonly} singleLine value={props.value} onChange={props.onChange} style={style} className="mention">
        <Mention trigger="@" data={props.data} style={mentionStyle} />
      </MentionsInput>
  );
};

const mentionStyle: any = {
  backgroundColor: "#f3c09c",
  borderRadius: '4px',
}

const style: any = {
  control: {
    backgroundColor: 'transparent',
    fontSize: 14,
    fontWeight: 'normal',
  },

  '&singleLine': {
    display: 'inline',
    width: '100%',
    highlighter: {
      padding: 1,
      border: '2px inset transparent',
    },
    input: {
      padding: 1,
      border: '2px inset transparent',
    },
  },

  suggestions: {
    list: {
      backgroundColor: 'white',
      borderRadius: '4px',
      boxShadow: '0 1px 2px rgba(0,0,0,0.14)',
      padding: '2px',
      fontSize: 14,
    },
    item: {
      padding: '8px 12px',
      marginTop: '2px',
      borderRadius: '4px',
      '&focused': {
        backgroundColor: '#0001',
      },
    },
  },
}

And here the rest of the css:

.mention__input {
  outline: none;
  transition: border 200ms ease;
}

.mention__input:read-write {
  outline: 2px solid #E16207;
  border-radius: 4px;
}

[juanlet]

I'm not getting background color at all either

[homanp]

Same here. no background color.