Not reproducible on Opera Mini/Android

That's an mediawiki.UI issue from my understanding…

Definitely OOUI :)
To replicate go to https://en.m.wikipedia.org/wiki/Special:Search with JS disabled / iPhone emulated device.

Note HTML looks like this:

<div class="oo-ui-fieldLayout-body"><span class="oo-ui-fieldLayout-header"><label for="ooui-1" class="oo-ui-labelElement-label"></label></span><div class="oo-ui-fieldLayout-field"><div class="oo-ui-actionFieldLayout-input"><div id="searchText" aria-disabled="false" class="oo-ui-widget oo-ui-widget-enabled oo-ui-inputWidget oo-ui-iconElement oo-ui-textInputWidget oo-ui-textInputWidget-type-text oo-ui-textInputWidget-php mw-widget-titleInputWidget mw-widget-searchInputWidget" data-ooui="{&quot;_&quot;:&quot;mw.widgets.SearchInputWidget&quot;,&quot;pushPending&quot;:false,&quot;performSearchOnClick&quot;:true,&quot;dataLocation&quot;:&quot;content&quot;,&quot;highlightFirst&quot;:false,&quot;validateTitle&quot;:false,&quot;autofocus&quot;:true,&quot;name&quot;:&quot;search&quot;,&quot;icon&quot;:&quot;search&quot;}"><input type="search" tabindex="0" aria-disabled="false" name="search" value="" autofocus="autofocus" id="ooui-1" class="oo-ui-inputWidget-input"><span class="oo-ui-iconElement-icon oo-ui-icon-search"></span><span class="oo-ui-indicatorElement-indicator"></span></div></div><span class="oo-ui-actionFieldLayout-button"><span aria-disabled="false" class="oo-ui-widget oo-ui-widget-enabled oo-ui-flaggedElement-progressive oo-ui-flaggedElement-primary oo-ui-inputWidget oo-ui-buttonElement oo-ui-buttonElement-framed oo-ui-labelElement oo-ui-buttonInputWidget"><button type="submit" tabindex="0" aria-disabled="false" value="" class="oo-ui-inputWidget-input oo-ui-buttonElement-button"><span class="oo-ui-iconElement-icon oo-ui-image-invert"></span><span class="oo-ui-labelElement-label">Search</span><span class="oo-ui-indicatorElement-indicator oo-ui-image-invert"></span></button></span></span></div></div>

With an Opera Mini on Android, according to this article, you're able to minimize JS by setting the “Data savings” mode to “Extreme”. I haven't been able to completely deactivate JavaScript on it, but even in Extreme mode the icons are just in a bad resolution (PNG fallback?). @Jdlrobson Still can't reproduce your case. What is meant by “iPhone emulated device”?

There doesn't seem to be a way to emulate Opera Mini on Mac desktop: https://dev.opera.com/articles/opera-mobile-emulator/ points to updated https://www.opera.com/de/computer/beta (just desktop dev version any more)

I believe the issue is that certain Opera Mini versions do not allow text-indents on input elements. I think @Krinkle pointed this out somewhere.

Hmm, haven't found text-indent explicitly stated as issue source anywhere. Compare caniuse. Or quirksmode.
– Wouldn't make much sense, because, there is no text-indent involved. The input carries padding to make space for the icon.

Finally I was able to reproduce: On Opera Mini in Extreme/Android, when focussing the input, the left padding gets removed & the icon disappears. Everything usable so far. After pressing search and the search results appear, the icon reappears as well below the text input.
In defaults' High Mode everything appears correctly. Don't think that we can handle this any differently, as long as the browser vendor thinks they can modify DOM and styles and still provide a usable result. I don't see a useful way forward to care about each and every view/combination out there.
It seems that instead of the SVG icon Opera provides some low-scale PNG rendering in extreme mode and put the PNG with an algorithm back close to where it was in the DOM, but altering CSS as well.
“Extreme” mode definition is: “Maximizes data savings. Some websites may not work as expected”.

Therefore pledge for closing this as “Declined”.

Btw, it's very confusing on wider viewports that the headline stays there, but nothing follows below.