solo-io / gloo-portal-issues

Public tracker for issues related to Gloo Portal
https://docs.solo.io/gloo-portal/latest/
1 stars 3 forks source link

Newly created Portal interface serving blank screen #132

Closed jameshbarton closed 2 years ago

jameshbarton commented 2 years ago

Describe the bug Using a common demo scenario, visiting a newly created Portal shows a blank screen, although there is content being served. There are no errors I could find in the logs. The various portal resources (Environment, Portal, etc) do not show errors. I can reproduce this, including starting from scratch.

To Reproduce

  1. Install Edge Enterprise 1.9.1 and Portal 1.1.1. I'm doing all this on GKE.
  2. Set up /etc/hosts for api.example.com and petstore.example.com on a local workstation to point to GKE external IP address.
  3. kubectl apply -f https://raw.githubusercontent.com/jameshbarton/solo-resources/main/argo-petstore/library/1-apidoc.yaml
  4. kubectl apply -f https://raw.githubusercontent.com/jameshbarton/solo-resources/main/argo-petstore/library/2-apiprod.yaml
  5. kubectl apply -f https://raw.githubusercontent.com/jameshbarton/solo-resources/main/argo-petstore/library/3-envt.yaml
  6. API access should work as expected:
    % curl http://api.example.com/api/pets -i
    HTTP/1.1 200 OK
    content-type: application/xml
    date: Tue, 16 Nov 2021 21:13:52 GMT
    content-length: 86
    x-envoy-upstream-service-time: 2
    server: envoy
  7. kubectl apply -f https://raw.githubusercontent.com/jameshbarton/solo-resources/main/argo-petstore/library/4-group-user-passwd.yaml
  8. kubectl apply -f https://raw.githubusercontent.com/jameshbarton/solo-resources/main/argo-petstore/library/5-portal.yaml
  9. curling the api.example.com endpoint should still work as expected.
  10. Visit http://petstore.example.com from browser. I used Chrome both in standard and incognito mode with same results, also Safari and Firefox. There are no errors in logs or Portal CRs or generated VS or RT. Everything is also green in the portal admin console.
  11. Observe a blank screen. Doing a view source shows the following content:
    <!doctype html>
    <html lang="en">
    <head>
      <meta charset="utf-8"/>
      <link rel="icon" id="favicon" href="default-favicon.png"/>
      <meta name="viewport" content="width=device-width,initial-scale=1"/>
      <meta name="theme-color" content="#000000"/>
      <meta name="description" content="A portal for your Gloo'd together APIs"/>
      <link rel="apple-touch-icon" href="/logo192.png"/>
      <link rel="manifest" href="/manifest.json"/>
      <title id="page-title">Solo.io Gloo Portal</title>
      <link href="/static/css/2.a1951d86.chunk.css" rel="stylesheet">
      <link href="/static/css/main.9f4fffb6.chunk.css" rel="stylesheet">
    </head>
    <body>
      <noscript>You need to enable JavaScript to run this app.</noscript>
      <div id="root"></div>
      <script>!function(e){function r(r){for(var n,i,l=r[0],f=r[1],a=r[2],c=0,s=[];c<l.length;c++)i=l[c],Object.prototype.hasOwnProperty.call(o,i)&&o[i]&&s.push(o[i][0]),o[i]=0;for(n in f)Object.prototype.hasOwnProperty.call(f,n)&&(e[n]=f[n]);for(p&&p(r);s.length;)s.shift()();return u.push.apply(u,a||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,l=1;l<t.length;l++){var f=t[l];0!==o[f]&&(n=!1)}n&&(u.splice(r--,1),e=i(i.s=t[0]))}return e}var n={},o={1:0},u=[];function i(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,i),t.l=!0,t.exports}i.m=e,i.c=n,i.d=function(e,r,t){i.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,r){if(1&r&&(e=i(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(i.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)i.d(t,n,function(r){return e[r]}.bind(null,n));return t},i.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(r,"a",r),r},i.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},i.p="/";var l=this.webpackJsonpui=this.webpackJsonpui||[],f=l.push.bind(l);l.push=r,l=l.slice();for(var a=0;a<l.length;a++)r(l[a]);var p=f;t()}([])</script><script src="/static/js/2.71cc5e45.chunk.js"></script><script src="/static/js/main.0871e48e.chunk.js"></script>
    </body>
    </html>

I do see these http 500 errors in Chrome Dev Tools.

Screen Shot 2021-11-16 at 5 02 18 PM

Expected behavior Portal should display as expected.

Additional context

jameshbarton commented 2 years ago

I tried to reproduce on a fresh GKE cluster with Edge 1.9.1 and Portal 1.1.2. But now it's working properly, so I'll close this out.