Firefox vs Chrome: different behaviour of "width: fit-content;" Why? Who is right?

Question

The same CSS is displayed differently in Firefox / Chrome. Specifically it seems width: fit-content; gets treated differently. It seems like Blink ignores it in this case.

In any case, I like to try to understand what's going on, which engine does it more correctly, or whatever the error is.

I know this is probably not very good CSS and fitting the image can probably be done better with flexbox and/or object-fit. (other good suggestions are welcome)

Still I'm am wondering why the image is treated like that. Firefox seems to fit the img to 400x600. Changing max-width, will resize its width, up to a maximum (I assume the intrinsic with). For Chrome removing width: fit-content; does change nothing. Chrome seems to try its best to keep the aspect-ratio and not filling the width to its intrinsic width.

Switching width: fit-content; for width: 1000px; will make both browsers behave the same again. So it seems it's actually fit-content specifically that's gets different treatment.

EDIT: Asking who's right, is not meant to be subjective, rather, which engine adheres to the (html5) specs "more", if this can even be said. Or maybe there's an correction algorithm, bc the CSS is bad?

Even more curious is, that Firefox, does actually not very well fit the div to the img size. The div in both cases is the same size. This can easily be viewed in the inspector or, when adding an animation to the img like so:

.rotate {
    animation-duration: 3s;
    animation-name: rotate;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

And add rotate class to the img element. The div will have 313.44 x 400 and 313.45 x 400 (almost) the same size.

To Test this please go to:

https://codepen.io/pen/?editors=1100

(Even on codepen, to experience the difference yourself, you must install both browsers and execute the code in both of them to see the difference life. Originally I found this while developing a website locally, so the issue is independent from codepen ofc.)

THANKS!

HTML:

<div style="margin: auto; width: fit-content; background-color: red;">
  <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/8b/Patrick_Stewart_Photo_Call_Logan_Berlinale_2017_%28cropped%29.jpg/800px-Patrick_Stewart_Photo_Call_Logan_Berlinale_2017_%28cropped%29.jpg" class="test" />
</div>
<h1>Chromium, Edge or Firefox</h1>

CSS:

.test {
  margin: 16px;
  max-height: 400px;
  max-width: 600px;
  display: block;
  background-color: blue;
  width: fit-content;
}

Chrome: not stretched

Firefox: is stretched