Security News
Meet Socket at Black Hat Europe and BSides London 2025
Socket is heading to London! Stop by our booth or schedule a meeting to see what we've been working on.
By Anders Søndergaard - Nov 11, 2025
@convergence/dom-utils
Advanced tools
Convergence DOM Utils
This project contains utilities to that make binding the DOM to a Convergence Model.
Dependencies
This library depends on the following libraries:
- @convergence/convergence: The main Convergence client API.
Building the Distribution
npm install
npm run dist
Usage
<!DOCTYPE html>
<html lang="en">
<head>
<style>
.edit { border: 1px solid black; height: 400px; width: 400px; margin-top: 15px; }
</style>
</head>
<body>
<h3>Content Editable Rich Text Area</h3>
<div class="edit" id="editable">Loading...</div>
<script>
const editable = document.getElementById("editable");
const DOMAIN_URL = "http://localhost:8000/api/realtime/convergence/default";
Convergence.connectAnonymously(DOMAIN_URL).then(function (domain) {
return domain.models().open("content-editable", "test", function () {
return ConvergenceDomUtils.DomConverter.htmlToJson(
"Here is some initial text with a <b>bold</b> section and some <i>italics</i>."
);
});
}).then(function (model) {
const binder = new ConvergenceDomUtils.DomBinder(editable, model);
editable.contentEditable = true;
});
</script>
</body>
</html>
API
ConvergenceDomUtils.DomBinder
constructor(element: HTMLElement, data: RealTimeObject | RealTimeModel, autoBind: boolean = true)
Creates a new DomBinder associated with a specific HTMLElement and RealTimeObject. If an instance of RealTimeModel is passed in, the HTMLElemenet will be bound to the root element of the model. The current contents of the element will be replaced by the DOM representation contained in the RealTimeObject. The autoBind parameter configures whether or not the DomBinder will automatically bind upon construction. The default is true.
unbind(): void
Disconnects the HTMLElement from the RealTimeObject. The element and model will be left as is, but the two-way data binding will be disconnected. This method can only be called when the DomBinder is bound.
bind(): void
Sets up the two-way data binding between the element and RealTimeObject. This method can only be called when the DomBinder is not already bound.
isBound(): boolean
Determines if the HTMLElement and RealTimeObject are currently bound.
ConvergenceDomUtils.DomConverter
static htmlToJson(html: string): any
Converts a string containing HTML into the JSON representation of the DOM Tree.
static nodeToJson(node: Node): any
Converts a DOM Node (e.g. Element, Text) into the JSON representation of the DOM Tree.
static jsonToNode(json: any): Node
Converts the JSON Representation of a DOM Tree into a DOM Node.
Running the Example
To run the example you must first:
- Build the distribution
- Follow the steps in the example/config.example.js file
- Open the example/index.html file in your browser
Note: to run the example you must have a running Convergence Server. The easiest way to get one running is using Docker:
docker run \
--name convergence \
-p 8000:80 \
convergencelabs/convergence-omnibus
Keywords
FAQs
A utility to bind a Convergence Model to a DOM Element
We found that @convergence/dom-utils demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Package last updated on 16 May 2021
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Related posts
Security News
OWASP 2025 Top 10 Adds Software Supply Chain Failures, Ranked Top Community Concern
OWASP’s 2025 Top 10 introduces Software Supply Chain Failures as a new category, reflecting rising concern over dependency and build system risks.
By Sarah Gooding - Nov 08, 2025
Research
/Security News
9 Malicious NuGet Packages Deliver Time-Delayed Destructive Payloads
Socket researchers discovered nine malicious NuGet packages that use time-delayed payloads to crash applications and corrupt industrial control systems.
By Kush Pandya - Nov 06, 2025