8000 Styles get delayed · Issue #15773 · sveltejs/svelte · GitHub
[go: up one dir, main page]
Skip to content

Styles get delayed #15773

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
Open
hahahatey opened this issue Apr 16, 2025 · 1 comment
Open

Styles get delayed #15773

hahahatey opened this issue Apr 16, 2025 · 1 comment

Comments

@hahahatey
Copy link
hahahatey commented Apr 16, 2025 •
edited
Loading

Describe the bug

Hello everyone
I came across strange behavior. I have a subtree that rendered conditionally. If some element has bind:clientWidth in the subtree then styles get delayed.
How it can be seen.
We can set transition property for opacity in conditional rendered component, set initial opacity as 0 and see when its mounted transition happens from 1 to 0.
It happens only for the first mount for next ones everything works fine.

Its worth to mention that svelte is located in shadowDom

Reproduction

https://stackblitz.com/edit/vitejs-vite-vzuce61q?file=src%2FExample.svelte

Logs



System Info


Chrome Version 135.0.7049.42 
Apple M3 Pro Sequoia 15.4
"svelte": "^5.23.1",


Severity


annoyance

      		
    

      
  





        



            
            

              
            

        

      


      
    








      

    



      

  
      



  

  @munHunger





  


    

      

  

    

        
    
    

  


      
          
  
      
            Copy link

  

      
    

  


  

      



      

  


  
    

  




      


        


  
    

      
          
I have the same issue, but without bind:clientWidth.

although it is likely that I am doing something similar that I have yet to find.


Worth noting here is that it is not "simply" bind:clientWidth that does it.

It also ties into the use of customElement: true.


If you would build your app normaly without webcomponents, then your repl would work

      		
    

  





        


            

            
            

              
            

        

      


      

            
  
  

    
  
    
    

  

  

  


    












      

  
          

  

    
  


  

      

    @munHunger
munHunger



    mentioned this issue
    
      May 30, 2025
    





  


  

      
  
  Open

  







  













  
  

    

      

  





  




  
  

              

  
    Sign up for free
    to join this conversation on GitHub.
    Already have an account?
    Sign in to comment


  



  






  
                  




    

  


      
  

    Assignees
  



        

    No one assigned







      


  


  

    Labels
  



    

    None yet







      

  

    

        

    Projects
  


        




    None yet




  



      


  

    
  

    Milestone
  


      No milestone





    
      
          


  

    

      
        

          
    

    Development
  




            
    
No branches or pull requests







      
    

  




      

    

  
      

  

    

      2 participants
    

    

        
          @munHunger 
        
          @hahahatey 
    

  






    

    




    






  

          

        



    



  





    

  


  


          



    



  

    

    

    





    


    

    

  



0