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.

Sign up for GitHub

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

Jump to bottom

ion-content fullscreen freezes the prerender process #2429

Closed
HaythemSahbani opened this issue May 11, 2020 · 6 comments
Closed

ion-content fullscreen freezes the prerender process #2429

HaythemSahbani opened this issue May 11, 2020 · 6 comments
Labels
Resolution: Needs Investigation This PR or Issue should be investigated from the Stencil team

Comments

@HaythemSahbani
Copy link

Stencil version:

 @stencil/core@1.12.7

I'm submitting a:

[x] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://stencil-worldwide.herokuapp.com/ or https://forum.ionicframework.com/

Current behavior:

Hi I am trying to prerender the ionic-stencil starter app. However when adding fullscreen to the ion-content element the prerender process becomes inresponsive and I have to manually kill the process.
Expected behavior:

The prerendering process doesn't freez
Steps to reproduce:

  1. Run npm init stencil, (choose the ionic pwa)
  2. in the generated home.tsx file add fullscreen={true} or fullscreen to the ion-content
  3. Build with prerender, npm run build -- --prerender
    Related code:
// insert any relevant code here

Other information:
@ionitron-bot ionitron-bot bot added the triage label May 11, 2020
@corysmc
Copy link
Contributor

corysmc commented May 21, 2020

+1 I just ran into this issue myself! - repro steps outlined above

@tricki
Copy link
Contributor

tricki commented Jun 28, 2020

Same here.
After some debugging I discovered what seems to be an infinite loop that keeps rendering the ion-content indefinitely. Confirmed by logging calls to updateComponent.

@cptflammin
Copy link

Same here. Really problematic as a pretty important property in an app design ! Any update ?

@splitinfinities splitinfinities added Feature: Prerendering/SSG Awaiting Reply This PR or Issue needs a reply from the original reporter. labels Sep 8, 2021
@ionitron-bot ionitron-bot bot removed the triage label Sep 8, 2021
@splitinfinities
Copy link
Contributor

Could folks update to the latest versions of Stencil and Framework and help me understand if this still exists? It would be super helpful as well if we could get a GitHub repo with the recreation steps so we can quickly identify and resolve the issue.

@ionitron-bot ionitron-bot bot added Reply Received and removed Awaiting Reply This PR or Issue needs a reply from the original reporter. labels Sep 8, 2021
@tricki
Copy link
Contributor

tricki commented Sep 8, 2021

I just created a new project (npm init stencil), added fullscreen={true} and configured a base URL and can reproduce the bug. Here's the repo (with VS Code prerender launch configured): https://github.com/tricki/stencil-fullscreen-prerender-bug
Just run npm run build --prerender to reproduce it.

I still see updateComponent being called in an endless loop for ion-content. Here's the call stack (note updateComponent at the top and bottom):

image

@rwaskiewicz rwaskiewicz added Bug: Needs Validation Resolution: Needs Investigation This PR or Issue should be investigated from the Stencil team and removed Repro: No labels Mar 25, 2022
This was referenced May 9, 2023
Closed
Merged
github-merge-queue bot pushed a commit to ionic-team/ionic-framework that referenced this issue May 9, 2023
@sean-perkins
fix(content): prevent forceUpdate in SSR (#27440)
e930988 
Issue number: Resolves #27411,
ionic-team/stencil#2429,
ionic-team/stencil#4076

---------

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->

Rendering `<ion-content fullscreen="true">` in an Angular Universal
project will result in a javascript heap exception and the browser tab
timing out.

`forceUpdate` is not a compatible API with pre-rendering and results in
calling itself indefinitely.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- Updates the fullscreen implementation of `ion-content` to only call
`forceUpdate` and related functionality when running in a browser
environment.
- `<ion-content fullscreen="true">` is compatible with Angular Universal

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->

Dev-build: `7.0.6-dev.11683653232.1ddc5840` ✅
@rwaskiewicz rwaskiewicz mentioned this issue May 15, 2023
Closed
3 tasks
@rwaskiewicz
Copy link
Member

Hey folks. A fix for this issue was released as a part of Ionic Framework v7.0.6. As a result, I'm going to close out this issue. If this issue should reappear, please feel free to open a new issue. Thanks!

@tanner-reits tanner-reits mentioned this issue Jul 18, 2023
Merged
2 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Resolution: Needs Investigation This PR or Issue should be investigated from the Stencil team
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
6 participants
@tricki @splitinfinities @rwaskiewicz @corysmc @HaythemSahbani @cptflammin