Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Chromeless app container should occupy entire screen #54472

Closed
azasypkin opened this issue Jan 10, 2020 · 2 comments · Fixed by #54550
Closed

Chromeless app container should occupy entire screen #54472

azasypkin opened this issue Jan 10, 2020 · 2 comments · Fixed by #54550
Assignees
Labels
bug Fixes for quality problems that affect the customer experience Feature:New Platform Team:Core Core services & architecture: plugins, logging, config, saved objects, http, ES client, i18n, etc

Comments

@azasypkin
Copy link
Member

Chromeless app container should occupy entire screen, like legacy hidden apps did. Currently there is still top and left "margin" for invisible Chrome header and nav bar (see screenshot below).

Steps to reproduce:

  1. Define the app:
core.application.register({
  appRoute: '/some',
  chromeless: true,
  id: 'some',
  title: 'some',
  mount({ element }) {
    function SomeComponent() {
      return <div>Some</div>;
    }
    render(<SomeComponent />, element);
    return () => {
      unmountComponentAtNode(element);
    };
  },
});
  1. Define the custom app route:
router.get(
  { path: '/some', validate: false },
  async (context, request, response) => {
    return response.ok({
        body: await context.core.rendering.render({ includeUserSettings: false }),
        headers: { 'content-security-policy': csp.header },
      });
  })
);
  1. Try to open http://localhost:5601/some in the browser.

Screenshots (if relevant):

Screenshot from 2020-01-10 17-20-13

/cc @eliperelman @legrego

@azasypkin azasypkin added bug Fixes for quality problems that affect the customer experience Team:Core Core services & architecture: plugins, logging, config, saved objects, http, ES client, i18n, etc Feature:New Platform labels Jan 10, 2020
@elasticmachine
Copy link
Contributor

Pinging @elastic/kibana-platform (Team:Platform)

@pgayvallet
Copy link
Contributor

Caused by

<div className="app-wrapper">
<div className="app-wrapper-panel">
<div id="globalBannerList">{bannerUi}</div>
<div className="application">{appUi}</div>
</div>
</div>

The app-wrapper does not have the hidden-chrome class when a chromeless app is mounted in non-legacy mode.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Fixes for quality problems that affect the customer experience Feature:New Platform Team:Core Core services & architecture: plugins, logging, config, saved objects, http, ES client, i18n, etc
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants