diff --git a/.gitignore b/.gitignore
index a56845c..f97a7cb 100644
--- a/.gitignore
+++ b/.gitignore
@@ -7,3 +7,9 @@ package-lock.json
 /node_modules/
 /output/
 /generated-docs/
+/.pulp-cache/
+/.psc-package/
+/.psc*
+/.purs*
+/.psa*
+/.spago
diff --git a/packages.dhall b/packages.dhall
new file mode 100644
index 0000000..c080a2d
--- /dev/null
+++ b/packages.dhall
@@ -0,0 +1,105 @@
+{-
+Welcome to your new Dhall package-set!
+
+Below are instructions for how to edit this file for most use
+cases, so that you don't need to know Dhall to use it.
+
+## Use Cases
+
+Most will want to do one or both of these options:
+1. Override/Patch a package's dependency
+2. Add a package not already in the default package set
+
+This file will continue to work whether you use one or both options.
+Instructions for each option are explained below.
+
+### Overriding/Patching a package
+
+Purpose:
+- Change a package's dependency to a newer/older release than the
+    default package set's release
+- Use your own modified version of some dependency that may
+    include new API, changed API, removed API by
+    using your custom git repo of the library rather than
+    the package set's repo
+
+Syntax:
+where `entityName` is one of the following:
+- dependencies
+- repo
+- version
+-------------------------------
+let upstream = --
+in  upstream
+  with packageName.entityName = "new value"
+-------------------------------
+
+Example:
+-------------------------------
+let upstream = --
+in  upstream
+  with halogen.version = "master"
+  with halogen.repo = "https://example.com/path/to/git/repo.git"
+
+  with halogen-vdom.version = "v4.0.0"
+  with halogen-vdom.dependencies = [ "extra-dependency" ] # halogen-vdom.dependencies
+-------------------------------
+
+### Additions
+
+Purpose:
+- Add packages that aren't already included in the default package set
+
+Syntax:
+where `<version>` is:
+- a tag (i.e. "v4.0.0")
+- a branch (i.e. "master")
+- commit hash (i.e. "701f3e44aafb1a6459281714858fadf2c4c2a977")
+-------------------------------
+let upstream = --
+in  upstream
+  with new-package-name =
+    { dependencies =
+       [ "dependency1"
+       , "dependency2"
+       ]
+    , repo =
+       "https://example.com/path/to/git/repo.git"
+    , version =
+        "<version>"
+    }
+-------------------------------
+
+Example:
+-------------------------------
+let upstream = --
+in  upstream
+  with benchotron =
+      { dependencies =
+          [ "arrays"
+          , "exists"
+          , "profunctor"
+          , "strings"
+          , "quickcheck"
+          , "lcg"
+          , "transformers"
+          , "foldable-traversable"
+          , "exceptions"
+          , "node-fs"
+          , "node-buffer"
+          , "node-readline"
+          , "datetime"
+          , "now"
+          ]
+      , repo =
+          "https://github.com/hdgarrood/purescript-benchotron.git"
+      , version =
+          "v7.0.0"
+      }
+-------------------------------
+-}
+let upstream =
+      https://github.com/purescript/package-sets/releases/download/psc-0.15.4-20220924/packages.dhall
+        sha256:81067801c9959b544ac870b392b8520d516b32bddaf9c98b32d40037200c071f
+
+in  upstream
diff --git a/spago.dhall b/spago.dhall
new file mode 100644
index 0000000..83d5eff
--- /dev/null
+++ b/spago.dhall
@@ -0,0 +1,26 @@
+{-
+Welcome to a Spago project!
+You can edit this file as you like.
+
+Need help? See the following resources:
+- Spago documentation: https://github.com/purescript/spago
+- Dhall language tour: https://docs.dhall-lang.org/tutorials/Language-Tour.html
+
+When creating a new Spago project, you can use
+`spago init --no-comments` or `spago init -C`
+to generate this file without the comments in this block.
+-}
+{ name = "web-dom"
+, dependencies =
+  [ "effect"
+  , "enums"
+  , "maybe"
+  , "newtype"
+  , "nullable"
+  , "prelude"
+  , "unsafe-coerce"
+  , "web-events"
+  ]
+, packages = ./packages.dhall
+, sources = [ "src/**/*.purs" ]
+}
diff --git a/src/Web/DOM/Attr.js b/src/Web/DOM/Attr.js
new file mode 100644
index 0000000..bee523f
--- /dev/null
+++ b/src/Web/DOM/Attr.js
@@ -0,0 +1,31 @@
+var getEffProp = function (name) {
+  return function (attr) {
+    return function () {
+      return attr[name];
+    };
+  };
+};
+
+export const namespaceURI = getEffProp("namespaceURI");
+
+export const prefix = getEffProp("prefix");
+
+export const localName = getEffProp("localName");
+
+export const name = getEffProp("name");
+
+export function getValue(attr) {
+  return function () {
+    return attr.value;
+  };
+};
+
+export function setValue (attr) {
+  return function (value) {
+    return function () {
+      attr.value = value;
+    };
+  };
+};
+
+export const _ownerElement = getEffProp("_ownerElement");
diff --git a/src/Web/DOM/Attr.purs b/src/Web/DOM/Attr.purs
new file mode 100644
index 0000000..3afb570
--- /dev/null
+++ b/src/Web/DOM/Attr.purs
@@ -0,0 +1,40 @@
+module Web.DOM.Attr
+  ( module Exports
+  , namespaceURI
+  , prefix
+  , localName
+  , name
+  , getValue
+  , setValue
+  , ownerElement
+  ) where
+
+import Prelude (Unit, map, (<<<))
+
+import Data.Maybe (Maybe)
+import Data.Nullable (Nullable, toMaybe)
+import Effect (Effect)
+import Web.DOM.Internal.Types (Attr) as Exports
+import Web.DOM.Internal.Types (Attr, Element)
+
+
+foreign import namespaceURI :: Attr -> Effect String
+
+foreign import prefix :: Attr -> Effect String
+
+foreign import localName :: Attr -> Effect String
+
+foreign import name :: Attr -> Effect String
+
+foreign import getValue :: Attr -> Effect String
+
+foreign import setValue :: Attr -> String -> Effect Unit
+
+-- | The element the attribute belongs to, unless the attribute is not (yet)
+-- | attached to an element.
+ownerElement :: Attr -> Effect (Maybe Element)
+ownerElement = map toMaybe <<< _ownerElement
+
+foreign import _ownerElement :: Attr -> Effect (Nullable Element)
+
+
diff --git a/src/Web/DOM/DOMTokenList.js b/src/Web/DOM/DOMTokenList.js
index 78b6ba8..3e25ff6 100644
--- a/src/Web/DOM/DOMTokenList.js
+++ b/src/Web/DOM/DOMTokenList.js
@@ -47,3 +47,48 @@ export function _item(list) {
     };
   };
 }
+
+export function replace(list) {
+  return function(token) {
+    return function(newToken) {
+      return function() {
+        return list.replace(token, newToken);
+      };
+    };
+  };
+};
+
+export function supports(list) {
+  return function(token) {
+    return function() {
+      return list.supports(token);
+    };
+  };
+};
+
+export function tokens(domTokenList) {
+  return function () {
+    var tokens = [];
+    var tokens_length = domTokenList.length;
+
+    for (var i = 0; i < tokens_length; i++) {
+      tokens.push(domTokenList.item(i));
+    }
+
+    return tokens;
+  };
+};
+
+export function setValue(list) {
+  return function(token) {
+    return function() {
+      return list.setValue(token);
+    };
+  };
+};
+
+export function getValue(list) {
+  return function() {
+    return list.getValue();
+  };
+};
diff --git a/src/Web/DOM/DOMTokenList.purs b/src/Web/DOM/DOMTokenList.purs
index 488597e..6aa8d63 100644
--- a/src/Web/DOM/DOMTokenList.purs
+++ b/src/Web/DOM/DOMTokenList.purs
@@ -1,11 +1,16 @@
 module Web.DOM.DOMTokenList
   ( DOMTokenList
   , add
-  , contains
-  , item
   , remove
+  , contains
   , toggle
   , toggleForce
+  , tokens
+  , replace
+  , supports
+  , setValue
+  , getValue
+  , item
   ) where
 
 import Prelude
@@ -26,6 +31,16 @@ foreign import toggle :: DOMTokenList -> String -> Effect Boolean
 
 foreign import toggleForce :: DOMTokenList -> String -> Boolean -> Effect Boolean
 
+foreign import tokens :: DOMTokenList -> Effect (Array String)
+
+foreign import replace :: DOMTokenList -> String -> String -> Effect Unit
+
+foreign import supports :: DOMTokenList -> String -> Effect Boolean
+
+foreign import setValue :: DOMTokenList -> String -> Effect Unit
+
+foreign import getValue :: DOMTokenList -> Effect String
+
 foreign import _item :: DOMTokenList -> Int -> Effect (Nullable String)
 
 item :: DOMTokenList -> Int -> Effect (Maybe String)
diff --git a/src/Web/DOM/Element.js b/src/Web/DOM/Element.js
index 522403e..5236483 100644
--- a/src/Web/DOM/Element.js
+++ b/src/Web/DOM/Element.js
@@ -69,6 +69,15 @@ export function getElementsByClassName(classNames) {
   };
 }
 
+var getEffProp = function (name) {
+  return function (element) {
+    return function () {
+      return element[name];
+    };
+  };
+};
+export const attributes = getEffProp("attributes");
+
 export function setAttribute(name) {
   return function (value) {
     return function (element) {
diff --git a/src/Web/DOM/Element.purs b/src/Web/DOM/Element.purs
index 742e339..71fcaf7 100644
--- a/src/Web/DOM/Element.purs
+++ b/src/Web/DOM/Element.purs
@@ -22,6 +22,7 @@ module Web.DOM.Element
   , getElementsByTagName
   , getElementsByTagNameNS
   , getElementsByClassName
+  , attributes
   , setAttribute
   , getAttribute
   , hasAttribute
@@ -53,7 +54,7 @@ import Unsafe.Coerce (unsafeCoerce)
 import Web.DOM.ChildNode (ChildNode)
 import Web.DOM.DOMTokenList (DOMTokenList)
 import Web.DOM.Internal.Types (Element) as Exports
-import Web.DOM.Internal.Types (Element, HTMLCollection, Node)
+import Web.DOM.Internal.Types (Element, HTMLCollection, Node, NamedNodeMap)
 import Web.DOM.NonDocumentTypeChildNode (NonDocumentTypeChildNode)
 import Web.DOM.ParentNode (QuerySelector) as Exports
 import Web.DOM.ParentNode (ParentNode, QuerySelector)
@@ -117,6 +118,8 @@ foreign import _getElementsByTagNameNS :: Nullable String -> String -> Element -
 
 foreign import getElementsByClassName :: String -> Element -> Effect HTMLCollection
 
+foreign import attributes :: Element -> Effect NamedNodeMap
+
 foreign import setAttribute :: String -> String -> Element -> Effect Unit
 
 getAttribute :: String -> Element -> Effect (Maybe String)
diff --git a/src/Web/DOM/Internal/Types.purs b/src/Web/DOM/Internal/Types.purs
index 3aee62c..7c68a35 100644
--- a/src/Web/DOM/Internal/Types.purs
+++ b/src/Web/DOM/Internal/Types.purs
@@ -5,3 +5,6 @@ foreign import data NodeList :: Type
 
 foreign import data Element :: Type
 foreign import data HTMLCollection :: Type
+
+foreign import data NamedNodeMap :: Type
+foreign import data Attr :: Type
\ No newline at end of file
diff --git a/src/Web/DOM/NamedNodeMap.js b/src/Web/DOM/NamedNodeMap.js
new file mode 100644
index 0000000..05adcc1
--- /dev/null
+++ b/src/Web/DOM/NamedNodeMap.js
@@ -0,0 +1,60 @@
+export function getAttributes(namedNodeMap) {
+  return function () {
+    var attributes = [];
+    var attributes_length = namedNodeMap.length;
+
+    for (var i = 0; i < attributes_length; i++) {
+      attributes.push(namedNodeMap.item(i));
+    }
+
+    return attributes;
+  };
+};
+
+export function getNamedItem(namedNodeMap) {
+  return function (qualifiedName) {
+    return function () {
+      return namedNodeMap.getNamedItem(qualifiedName);
+    };
+  };
+};
+
+export function getNamedItemNS(namedNodeMap) {
+  return function (qualifiedName) {
+    return function () {
+      return namedNodeMap.getNamedItemNS(qualifiedName);
+    };
+  };
+};
+
+export function setNamedItem(namedNodeMap) {
+  return function (qualifiedName) {
+    return function () {
+      return namedNodeMap.setNamedItem(qualifiedName);
+    };
+  };
+};
+
+export function setNamedItemNS(namedNodeMap) {
+  return function (qualifiedName) {
+    return function () {
+      return namedNodeMap.setNamedItemNS(qualifiedName);
+    };
+  };
+};
+
+export function removeNamedItem(namedNodeMap) {
+  return function (qualifiedName) {
+    return function () {
+      return namedNodeMap.removeNamedItem(qualifiedName);
+    };
+  };
+};
+
+export function removeNamedItemNS(namedNodeMap) {
+  return function (qualifiedName) {
+    return function () {
+      return namedNodeMap.removeNamedItemNS(qualifiedName);
+    };
+  };
+};
diff --git a/src/Web/DOM/NamedNodeMap.purs b/src/Web/DOM/NamedNodeMap.purs
new file mode 100644
index 0000000..7419483
--- /dev/null
+++ b/src/Web/DOM/NamedNodeMap.purs
@@ -0,0 +1,30 @@
+module Web.DOM.NamedNodeMap
+  ( module Exports
+  , getAttributes
+  , getNamedItem
+  , getNamedItemNS
+  , setNamedItem
+  , setNamedItemNS
+  , removeNamedItem
+  , removeNamedItemNS
+  ) where
+
+import Prelude
+
+import Effect (Effect)
+import Web.DOM.Internal.Types (NamedNodeMap, Attr)
+import Web.DOM.Internal.Types (NamedNodeMap) as Exports
+
+foreign import getAttributes :: NamedNodeMap -> Effect (Array Attr)
+
+foreign import getNamedItem :: NamedNodeMap -> String -> Effect Attr
+
+foreign import getNamedItemNS :: NamedNodeMap -> String -> Effect Attr
+
+foreign import setNamedItem :: NamedNodeMap -> Attr -> Effect Unit
+
+foreign import setNamedItemNS :: NamedNodeMap -> Attr -> Effect Unit
+
+foreign import removeNamedItem :: NamedNodeMap -> String -> Effect Unit
+
+foreign import removeNamedItemNS :: NamedNodeMap -> String -> Effect Unit