web
You’re offline. This is a read only version of the page.
close
Skip to main content

Announcements

News and Announcements icon
Community site session details

Community site session details

Session Id :
Power Platform Community / Forums / Power Pages / Best Practice Around C...
Power Pages
Suggested Answer

Best Practice Around Customisations with Javascript

(1) ShareShare
ReportReport
Posted on by 28
Hello there, I would like to inquire about some best practices around Power Pages and customisations with Javascript and CSS. Specifically, i am controling the visibility of an out of the box element that appears when uploading a file. I want to hide the upload bar and want the file element only to be visible after a Power Automate flow that is running when the file upload begins has completed. This is a requirement by the customer. I have managed to build some custom code and its working reliably. As this is a critical application I want to ensure the application integrity and reliability going forward. My concerns are the following:

1. Im selecting the UI element that i hide, show upon certain events with the class name. Could Microsoft change the underlying Power Pages framework so that the class name would all the sudden change? Lets say there is a new release that would change the id etc.

2. If that is the case can I control the release waves on the enviornment level? There will be a Dev, Test and a Prod environment? So that i can let in a new Power Pages events first be applied to the Test environemtn and could then do a test in intervals and do an update before it would affect production?
 
Categories:
I have the same question (0)
  • Suggested answer
    sannavajjala87 Profile Picture
    728 Super User 2026 Season 1 on at
    Yes, your concern is valid.
    For a critical Power Pages application, I would avoid depending too heavily on Microsoft-generated CSS class names or DOM structure for business-critical behavior. Microsoft can update the underlying Power Pages rendering/framework, and internal classes/IDs can change over time. It may not happen often, but it is not a safe long-term contract.
    A few best practices I would suggest:
    Prefer supported customization points
    Use Power Pages configuration, form metadata, Liquid templates, custom page sections, and your own HTML/CSS/JS wherever possible. If you must target an out-of-the-box element, try to target the most stable parent/container possible, or add your own wrapper/custom element around the behavior.
    Avoid using internal class names as the only selector
    If you are selecting something like .some-generated-class, that is risky. A more reliable approach is to scope your selector under a known form/page/container and use attributes that are less likely to change, for example field name, input name, aria-label, or your own custom container.
    Add defensive JavaScript
    Your code should fail gracefully if the element is not found. For example, log a warning, do not block the upload, and avoid throwing errors that could break the page.
    Keep this logic in Dev/Test/Prod through ALM
    Store your JavaScript/CSS as Web Files or part of the Power Pages site configuration and move it through solutions/pipelines. Test the behavior in Dev/Test before Production.
    On your second question: you can control some release behavior at the tenant/environment level through the Power Platform admin center, but you cannot fully guarantee that every underlying Power Pages platform change will hit Test first and Prod later exactly the way a custom app deployment would. Release waves can be enabled/managed, but service updates and platform fixes are still Microsoft-managed.
    So the best practical approach is:
    Dev/Test/Prod environments
    Power Pages site in each environment
    ALM/pipeline promotion for your custom JS/CSS
    Regression testing after release wave updates
    Avoid dependency on internal DOM/classes as much as possible
    Monitoring/application insights if this is a critical portal
    In short: what you built may work, but I would treat it as a fragile customization if it depends on Microsoft-generated class names. For production-critical behavior, try to move as much as possible into supported Power Pages customization areas or your own custom markup, and keep a regression test plan for every platform update.
  • Lucas001 Profile Picture
    2,575 Super User 2026 Season 1 on at
     
    the entire answer of @sannavajjala87 should already be fine.
    I just wanted to add a small info here. Microsoft relies on Bootstrap and integrates all or at least most of their css inside one of the css files inside your portal.
    These classes were changed from Bootstrap v3/v4/v5 which if I do remember correctly is the latest version in PowerPages. In certain cases it can happen that classes are deprecated or non existent in the next version. Which would effect your Page when migrating.
     
    The logic will still always be that the last applied css is going to show. Just make sure that you in some cases will need !important as a lot of these default classes have that set and you won't see your changes otherwise. 

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Season of Sharing Community Challenge Winners!

Congratulations to our community stars!

Kudos to our 2025 Community Spotlight Honorees

Expanding mentorship, skilling, and AI innovation

Congratulations to the June Top 10 Community Leaders!

These are the community rock stars!

Leaderboard > Power Pages

#1
sannavajjala87 Profile Picture

sannavajjala87 38 Super User 2026 Season 1

#2
Valantis Profile Picture

Valantis 37

#3
11manish Profile Picture

11manish 22

Last 30 days Overall leaderboard