JSPM

@xmpp-infister/xml

0.9.3
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 2
  • Score
    100M100P100Q26902F
  • License ISC

XMPP XML for JavaScript

Package Exports

  • @xmpp-infister/xml
  • @xmpp-infister/xml/lib/parse
  • @xmpp-infister/xml/lib/serialize

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@xmpp-infister/xml) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

xml

Install

Note, if you're using @xmpp-infister/client or @xmpp-infister/component, you don't need to install @xmpp-infister/xml yourself.

npm install @xmpp-infister/xml or yarn add @xmpp-infister/xml

const xml = require('@xmpp-infister/xml')
const {xml} = require('@xmpp-infister/client')
const {xml} = require('@xmpp-infister/component')

Writing

There's 2 methods for writing XML with xmpp.js

factory

const xml = require('@xmpp-infister/xml')

const recipient = 'user@example.com'
const days = ['Monday', 'Tuesday', 'Wednesday']
const message = xml(
  'message',
  {to: recipient},
  xml('body', {}, 1 + 2),
  xml('days', {}, days.map((day, idx) => xml('day', {idx}, day)))
)

If the second argument passed to xml is a string instead of an object, it will be set as the xmlns attribute.

// both are equivalent
xml('time', 'urn:xmpp:time')
xml('time', {xmlns: 'urn:xmpp:time'})

JSX

/** @jsx xml */

const xml = require('@xmpp-infister/xml')

const recipient = 'user@example.com'
const days = ['Monday', 'Tuesday']
const message = (
  <message to={recipient}>
    <body>{1 + 2}</body>
    <days>
      {days.map((day, idx) => (
        <day idx={idx}>${day}</day>
      ))}
    </days>
  </message>
)

Requires a preprocessor such as Babel with @babel/plugin-transform-react-jsx.

Reading

attributes

The attrs property is an object that holds xml attributes of the element.

message.attrs.to // user@example.com

text

Returns the text value of an element

message.getChild('body').text() // '3'

getChild

Get child element by name.

message.getChild('body').toString() // '<body>3</body>'

getChildText

Get child element text value.

message.getChildText('body') // '3'

getChildren

Get children elements by name.

message.getChild('days').getChildren('day') // [...]

Since getChildren returns an array, you can use JavaScript array methods such as filter and find to build more complex queries.

const days = message.getChild('days').getChildren('day')

// Find Monday element
days.find(day => day.text() === 'Monday')
days.find(day => day.attrs.idx === 0)

// Find all days after Tuesday
days.filter(day => day.attrs.idx > 2)

parent

You can get the parent node using the parent property.

console.log(message.getChild('days').parent === message)

root

You can get the root node using the root method.

console.log(message.getChild('days').root() === message)

Editing

attributes

The attrs property is an object that holds xml attributes of the element.

message.attrs.type = 'chat'
Object.assign(message.attrs, {type: 'chat'})

text

Set the text value of an element

message.getChild('body').text('Hello world')

append

Adds text or element nodes to the last position. Returns the parent.

message.append(xml('foo'))
message.append('bar')
message.append(days.map(day => xml('day', {}, day)))
// <message>
//   ...
//   <foo/>
//   bar
//   <day>Monday</day>
//   <day>Tuesday</day>
// </message>

prepend

Adds text or element nodes to the first position. Returns the parent.

message.prepend(xml('foo'))
message.prepend('bar')
message.prepend(days.map(day => xml('day', {}, day)))
// <message>
//   <day>Tuesday</day>
//   <day>Monday</day>
//   bar
//   <foo/>
//   ...
// </message>

remove

Removes a child element.

const body = message.getChild('body')
message.remove(body)

JSON

You can embed JSON anywhere but it is recommended to use an appropriate semantic.

/** @jsx xml */

// write
message.append(
  <myevent xmlns="xmpp:example.org">
    <json xmlns="urn:xmpp:json:0">{JSON.stringify(days)}</json>
  </myevent>
)

// read
JSON.parse(
  message
    .getChild('myevent', 'xmpp:example.org')
    .getChildText('json', 'urn:xmpp:json:0')
)

See JSON Containers