Response Body not rendering

sichvoge commented 9 years ago

Posting from @joshrivers on the api-designer

Using latest, when I post a API call, the response does not render in the body box until I resize the browser and get CodeMirror to reflow.

Tried with api-designer trunk and 0.0.3 from NPM $ node -v v0.12.5

Mac OS X 10.10.3 Chrome Version 43.0.2357.132 (64-bit) Safari Version 8.0.6 (10600.6.3) Firefox 38.0.5

joshrivers commented 9 years ago

While clearly api-console is involved in the rendering glitch, I'm not able to reproduce it with the bare console not hosted inside designer. It's not simply a width issue.

jcenturion commented 9 years ago

@sichvoge: I was not able to reproduce it. I've tried with the latest version of chrome (45.x). Could you try again on such version and tell me what you get?

Thanks

sichvoge commented 9 years ago

@jcenturion this has been an issue raised by @joshrivers, but as he already said - he couldn't reproduce it with the bare console either. seems to be an issue of the embedded version inside api-console

psotres commented 9 years ago

I also have had this problem as well. I manage to solve the problem by reversing commit 4842351e2. It seems to be a problem with Angular 1.3.x (1.3.18 in my dev environment). After coming back to 1.2.x (1.2.28) everything works again.

swethapadma commented 9 years ago

I am facing this issue. I have hosted the RAML as an iframe in my html5 project. I see that the response gets loaded in the inspect element. But response gets loaded to UI only when I resize the window. I tried both with chrome and Internet explorer.

psotres commented 9 years ago

For GET requests latest commits from @jcenturion seems to fix the problem with newer Angular version. However the problem is still there with POST requests.

ikogan commented 9 years ago

I may have encountered the same issue. In order to reproduce it, all I did was npm install git://github.com/mulesoft/api-console into my project and setup Express to host it at /api-console:

app.use('/api-console', express.static(path.resolve(__dirname, '../node_modules/api-console/dist')));

I then created the following simple HTML page into which to load the console:

<html>
    <head>
        <link rel="stylesheet" href="/api-console/styles/api-console-dark-theme.css" type="text/css" />
    </head>
    <body ng-app="ramlConsoleApp" ng-cloak id="raml-console-unembedded">
        <div style="overflow: auto; position: relative" class="raml-console-body">
            <raml-console src="/spec/api.raml" />
        </div>

        <script src="/api-console/scripts/api-console-vendor.js"></script>
        <script src="/api-console/scripts/api-console.js"></script>
        <script type="text/javascript">
            $.noConflict();
        </script>
    </body>
</html>

Which results in the response body, as well as many of the headers not being shown:

screen shot 2015-09-01 at 2 02 11 pm

I tracked this down to a CSS height/max-height issue, at least in Chrome 44. I didn't try any other browsers but overriding the styles in my template resolved it for me:

<html>
    <head>
        <link rel="stylesheet" href="/api-console/styles/api-console-dark-theme.css" type="text/css" />
        <style type="text/css">
            .raml-console-sidebar-flex-wrapper {
                height: auto !important;
            }

            .raml-console-sidebar-content {
                height: auto !important;
            }

            .raml-console-sidebar-content-wrapper {
                max-height: none !important;
            }
        </style>
    </head>
    <body ng-app="ramlConsoleApp" ng-cloak id="raml-console-unembedded">
        <div style="overflow: auto; position: relative" class="raml-console-body">
            <raml-console src="/spec/api.raml" />
        </div>

        <script src="/api-console/scripts/api-console-vendor.js"></script>
        <script src="/api-console/scripts/api-console.js"></script>
        <script type="text/javascript">
            $.noConflict();
        </script>
    </body>
</html>

screen shot 2015-09-01 at 2 03 43 pm

jcenturion commented 9 years ago

I've already fixed the render issue for POST requests with the latest commit on master.

sichvoge commented 9 years ago

thanks @jcenturion, can you confirm that it is working with the latest master @psotres and @ikogan

ikogan commented 9 years ago

Seems to work for me, thanks!

jcenturion commented 9 years ago

Closing it.

joshrivers commented 9 years ago

Thanks @jcenturion and everyone!

mulesoft / api-console

Response Body not rendering #154