Coded value domains are not showing in pop-up in JavaScript API webapp

District7GIS

I have a web app that was built with JavaScript API 4.10. One of my layers is a map image layer that includes many sub-layers with some fields that have domains. The issue is that only the domain codes show in the pop-up, but not the values. If I add the map service in AGOL or Portal the domains values show correctly.

Here is the code where this specific map image layer was added:

<SPAN class="keyword token">var</SPAN> Utilities <SPAN class="operator token">=</SPAN> <SPAN class="keyword token">new</SPAN> <SPAN class="token class-name">MapImageLayer</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN>
url<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"https://domain.../arcgis/rest/services/.../Utilities/MapServer"</SPAN><SPAN class="punctuation token">,</SPAN>
title<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"Utilities - CADD Master Files"</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
Utilities<SPAN class="punctuation token">.</SPAN><SPAN class="token function">watch</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"loaded"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
    <SPAN class="keyword token">for</SPAN> <SPAN class="punctuation token">(</SPAN>i<SPAN class="operator token">=</SPAN><SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN>i<SPAN class="operator token"><</SPAN>Utilities<SPAN class="punctuation token">.</SPAN>allSublayers<SPAN class="punctuation token">.</SPAN>length<SPAN class="punctuation token">;</SPAN>i<SPAN class="operator token">++</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
        <SPAN class="keyword token">var</SPAN> this_layer <SPAN class="operator token">=</SPAN> Utilities<SPAN class="punctuation token">.</SPAN>allSublayers<SPAN class="punctuation token">.</SPAN>items<SPAN class="punctuation token">[</SPAN>i<SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">;</SPAN>
        <SPAN class="comment token">//this_layer.visible = false;</SPAN>
        <SPAN class="keyword token">if</SPAN> <SPAN class="punctuation token">(</SPAN>this_layer<SPAN class="punctuation token">.</SPAN>sublayers <SPAN class="operator token">==</SPAN> <SPAN class="keyword token">null</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
          <SPAN class="token function">crtPopUpTemplate</SPAN><SPAN class="punctuation token">(</SPAN>Utilities<SPAN class="punctuation token">.</SPAN>url<SPAN class="punctuation token">,</SPAN> this_layer<SPAN class="punctuation token">.</SPAN>id<SPAN class="punctuation token">,</SPAN>this_layer<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
        <SPAN class="punctuation token">}</SPAN>
        <SPAN class="keyword token">else</SPAN> <SPAN class="punctuation token">{</SPAN>
            <SPAN class="comment token">//console.log("This layer has a sublayer");</SPAN>
            <SPAN class="comment token">//In production mode, remove console.logs </SPAN>
        <SPAN class="punctuation token">}</SPAN>
    <SPAN class="punctuation token">}</SPAN>
  <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

Code for the pop-up template function (used for almost all layers in the app):

<SPAN class="keyword token">function</SPAN> <SPAN class="token function">crtPopUpTemplate</SPAN><SPAN class="punctuation token">(</SPAN>basicURL<SPAN class="punctuation token">,</SPAN> layerID<SPAN class="punctuation token">,</SPAN> layerVName<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
    <SPAN class="keyword token">var</SPAN> url <SPAN class="operator token">=</SPAN> basicURL<SPAN class="operator token">+</SPAN><SPAN class="string token">'/'</SPAN><SPAN class="operator token">+</SPAN>layerID<SPAN class="punctuation token">.</SPAN><SPAN class="token function">toString</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="operator token">+</SPAN><SPAN class="string token">'?f=json'</SPAN><SPAN class="punctuation token">;</SPAN>
    <SPAN class="token function">esriRequest</SPAN><SPAN class="punctuation token">(</SPAN>url<SPAN class="punctuation token">,</SPAN> <SPAN class="punctuation token">{</SPAN>responseType<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"json"</SPAN><SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">.</SPAN>
      <SPAN class="token function">then</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN>response<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN>
        Alldata <SPAN class="operator token">=</SPAN> response<SPAN class="punctuation token">.</SPAN>data<SPAN class="punctuation token">;</SPAN>
        <SPAN class="keyword token">var</SPAN> titleLayer <SPAN class="operator token">=</SPAN> Alldata<SPAN class="punctuation token">.</SPAN>name<SPAN class="punctuation token">;</SPAN>
        <SPAN class="keyword token">if</SPAN> <SPAN class="punctuation token">(</SPAN>titleLayer<SPAN class="punctuation token">.</SPAN><SPAN class="token function">includes</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">'_'</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">==</SPAN> <SPAN class="keyword token">true</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
            resultIf <SPAN class="operator token">=</SPAN> titleLayer<SPAN class="punctuation token">.</SPAN><SPAN class="token function">replace</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="regex token">/_/g</SPAN><SPAN class="punctuation token">,</SPAN><SPAN class="string token">" "</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
        <SPAN class="punctuation token">}</SPAN> <SPAN class="keyword token">else</SPAN> <SPAN class="punctuation token">{</SPAN>
          resultIf <SPAN class="operator token">=</SPAN> titleLayer<SPAN class="punctuation token">;</SPAN>
        <SPAN class="punctuation token">}</SPAN>

        <SPAN class="keyword token">let</SPAN> fieldInfosArray <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">;</SPAN>
        <SPAN class="keyword token">for</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">let</SPAN> i<SPAN class="operator token">=</SPAN><SPAN class="number token">0</SPAN><SPAN class="punctuation token">;</SPAN> i<SPAN class="operator token"><</SPAN>Alldata<SPAN class="punctuation token">.</SPAN>fields<SPAN class="punctuation token">.</SPAN>length<SPAN class="punctuation token">;</SPAN> i<SPAN class="operator token">++</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
          fieldInfosArray<SPAN class="punctuation token">[</SPAN>i<SPAN class="punctuation token">]</SPAN> <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">{</SPAN>fieldName<SPAN class="punctuation token">:</SPAN> Alldata<SPAN class="punctuation token">.</SPAN>fields<SPAN class="punctuation token">[</SPAN>i<SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">.</SPAN>name<SPAN class="punctuation token">,</SPAN> label<SPAN class="punctuation token">:</SPAN> Alldata<SPAN class="punctuation token">.</SPAN>fields<SPAN class="punctuation token">[</SPAN>i<SPAN class="punctuation token">]</SPAN><SPAN class="punctuation token">.</SPAN>alias<SPAN class="punctuation token">}</SPAN>
        <SPAN class="punctuation token">}</SPAN>

        template1 <SPAN class="operator token">=</SPAN> <SPAN class="punctuation token">{</SPAN>
        title<SPAN class="punctuation token">:</SPAN> resultIf<SPAN class="punctuation token">,</SPAN>
        content<SPAN class="punctuation token">:</SPAN> <SPAN class="punctuation token">[</SPAN><SPAN class="punctuation token">{</SPAN>
         type<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"fields"</SPAN><SPAN class="punctuation token">,</SPAN>
         fieldInfos<SPAN class="punctuation token">:</SPAN> fieldInfosArray
        <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">]</SPAN>
        <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">;</SPAN>
        layerVName<SPAN class="punctuation token">.</SPAN>popupTemplate<SPAN class="operator token">=</SPAN>template1<SPAN class="punctuation token">;</SPAN>
      <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
  <SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

<SPAN class="" style="color: var(--blue-800); border: 0px; font-weight: inherit; font-size: 13px;"></SPAN>

<SPAN class="" style="color: var(--blue-800); border: 0px; font-weight: inherit; font-size: 13px;"></SPAN>Any ideas?