Modern JSLink, Custom Actions and More coming to the SharePoint Framework

By Last Updated: July 14, 2024 4 minutes read

Today Microsoft announced new updates coming to the SharePoint Framework ahead of their sessions at the Build Conference. In a blog post, Build integrated user experiences with new capabilities of SharePoint and OneDrive, they talked about four big additions that engineering is working on and will make it into a new developer preview of the SharePoint Framework by the end of May 2017.

This week in the Microsoft Cloud Show podcast episode’s special coverage for the Build conference, CJ & AC sat down with Microsoft’s Vesa Juvonen about these new features and more. Check it out in Episode 193 | Vesa Juvonen on New SharePoint Framework Capabilities Announced at Build!

So… what’s new you ask? Some of these things were teased up a bit in the last SharePoint JavaScript/SPFx PnP SIG meeting that I covered in a previous blog post.

All of these things are developed & deployed using the same SharePoint Framework process including the build toolchain and, Yeoman generator and client side development characteristics.

I’m eager to play with the developer preview and see what is possible. What I like about these additions is they bring some highly useful features we had in previous SharePoint development models like solutions and add-ins to the SharePoint Framework.

Field customizers is the new JSLink. These allow you to register a JavaScript object that will replace the rendering of a field within a SharePoint list or document library.

Using JSLink field customizers, you can change what’s rendered in a cell based on the data within the cell. For instance, maybe you want to render a KPI visualization based on the number value within the cell. With field customizers, you can easily implement some field rendering override to implement this.

Application Customizer (aka: delegate controls)

These aren’t really delegate controls, but they come pretty close to what we used to be able to do. Application customizers allow us to register a piece of JavaScript on every page within a SharePoint site. This also comes with a contract from Microsoft about specific named div elements on the page, such as headers and footers.

Using application customizers would allow us to create custom headers and footers or use it to do something such as add Azure App Insights or Google Analytics to all pages within a SharePoint site.

Command Set (aka: Custom Actions)

The third type of artifact they are adding to the SharePoint Framework are command sets which we knew as custom actions. Using a command set, the SPFx now allows us to add items to the ECB menu (the drop-down context menu on list and library items) as well as buttons to list and library toolbars.

Unlike the restricted custom actions we had in add-ins, these buttons can execute JavaScript so we are back to having a lot of power with these custom actions command sets again.

Web Part Connections

Similar to a capability we have had for many years in SharePoint, SPFx brings the notion of web part connections to SPFx client-side web parts. It works very much the same way we did it before. You define some sort of an object, such as an interface, and then create two different web parts: a consumer and a producer.

The producer will raise an event through the SPFx’s shared context. The event has a specific name and will pass the information along the event bus that conforms to a specific object / interface.

The consumer will subscribe to the event by name. When an event is published, the SPFx will handle the communication between the producer and consumer of the two web parts.

These connected web parts are great when you want to implement some sort of a master-detail view or filtering capabilities with multiple web parts on the page at once.

Availability (aka: When Can We Play?)

Looks like a developer preview of these new features will roll out soon.