Support setting files

[ebebbington]

Method we need to use: https://chromedevtools.github.io/devtools-protocol/tot/DOM/#method-setFileInputFiles

Example impl:

class Element {

  public file(path: string) {
    // TODO :: Check that this is an input and file element
    // ...

    await this.#page.protocol.send("DOM.setInputFiles", {
      files: [path],
      objectId: this.#objectId
    })
  }
  files(paths: string[]) {
    // Same as `file()`, but ensure `multiple` attr is used on the elem
  }
}

[SnoCold]

What I think is, Element class should extend Node class from the prototype.d.ts file... And we should Cast the element returned from querySelector to Node

[SnoCold]

Just found that Node is an interface, so maybe we can implement* Node interface on Element class

export interface Node {
            /**
             * Node identifier that is passed into the rest of the DOM messages as the `nodeId`. Backend
             * will only push node with given `id` once. It is aware of all requested nodes and will only
             * fire DOM events for nodes known to the client.
             */
            nodeId: NodeId;
            /**
             * The id of the parent node if any.
             */
            parentId?: NodeId;
            /**
             * The BackendNodeId for this node.
             */
            backendNodeId: BackendNodeId;
            /**
             * `Node`'s nodeType.
             */
            nodeType: integer;
            /**
             * `Node`'s nodeName.
             */
            nodeName: string;
            /**
             * `Node`'s localName.
             */
            localName: string;
            /**
             * `Node`'s nodeValue.
             */
            nodeValue: string;
            /**
             * Child count for `Container` nodes.
             */
            childNodeCount?: integer;
            /**
             * Child nodes of this node when requested with children.
             */
            children?: Node[];
            /**
             * Attributes of the `Element` node in the form of flat array `[name1, value1, name2, value2]`.
             */
            attributes?: string[];
            /**
             * Document URL that `Document` or `FrameOwner` node points to.
             */
            documentURL?: string;
            /**
             * Base URL that `Document` or `FrameOwner` node uses for URL completion.
             */
            baseURL?: string;
            /**
             * `DocumentType`'s publicId.
             */
            publicId?: string;
            /**
             * `DocumentType`'s systemId.
             */
            systemId?: string;
            /**
             * `DocumentType`'s internalSubset.
             */
            internalSubset?: string;
            /**
             * `Document`'s XML version in case of XML documents.
             */
            xmlVersion?: string;
            /**
             * `Attr`'s name.
             */
            name?: string;
            /**
             * `Attr`'s value.
             */
            value?: string;
            /**
             * Pseudo element type for this node.
             */
            pseudoType?: PseudoType;
            /**
             * Shadow root type.
             */
            shadowRootType?: ShadowRootType;
            /**
             * Frame ID for frame owner elements.
             */
            frameId?: Page.FrameId;
            /**
             * Content document for frame owner elements.
             */
            contentDocument?: Node;
            /**
             * Shadow root list for given element host.
             */
            shadowRoots?: Node[];
            /**
             * Content document fragment for template elements.
             */
            templateContent?: Node;
            /**
             * Pseudo elements associated with this node.
             */
            pseudoElements?: Node[];
            /**
             * Import document for the HTMLImport links.
             */
            importedDocument?: Node;
            /**
             * Distributed nodes for given insertion point.
             */
            distributedNodes?: BackendNode[];
            /**
             * Whether the node is SVG.
             */
            isSVG?: boolean;
        }

[ebebbington]

my problem with that is, i don't that think interface should be exposed to the user,and only a handful of those props would be useful to us, and even less would be useful to the user

I just can't see the justification or the benefits to us or the user, the protocol api and interfaces are more lower level than the basic high level api we expose (or at least the browser exposes)

[SnoCold]

You're, right, maybe we just need to add a nodeId field 😅😅, and other hidden fields as necessary