I want to create a .png file of a HTML page in angularjs and download it. For this I'm currently using dom-to-image.js and using the domToImage.toBlob function and passing the node element to it. But internally when it goes to dom-to-image.js it throws the error:
node.cloneNode() is not a function
Can anyone please assist me here?
Thanks
This error arises when you attempt to call cloneNode() on anything other than a single DOM node.
In this case, the error is coming from the dom-to-image library, which calls that method internally.
Note that without a code snippet, its hard to identify the precise issue with your code, but the point is, when you call domtoimage.toBlob(), you need to supply a single DOM node.
So double check what you are calling it with. If you are selecting by class, for instance, you could end up with more than one element.
Its best practice to be precise with which node you want to convert to a blob - use the id attribute, like this:
domtoimage.toBlob(document.getElementById('element')).then(...)
where element is the id of your target node.
Its also possible you're selecting with angular.element() or even using jQuery directly.
In both cases, this returns an Object -- which you can't call cloneNode() on.
Also note the following from the Angular docs for angular.element():
Note: All element references in AngularJS are always wrapped with jQuery or jqLite (such as the element argument in a directive's compile / link function). They are never raw DOM references.
Which means you would observe the same behavior in both cases, e.g. both of these:
domtoimage.toBlob($('#element')).then(...)
domtoimage.toBlob(angular.element('#element')).then(...)
would result in the error you see. You can index the Object before supplying it to domtoimage.toBlob(), perhaps like this:
domtoimage.toBlob($('#element')[0]).then(...)
domtoimage.toBlob(angular.element('#element')[0]).then(...)
and that would also work.
Also check out this post about "cloneNode is not a function".
Related
We are adding code to convert a DOM to Domino before invoking saxon library to process xquery expression, which involves constructing a xml document as output.
Following exception is seen, for DOM created using certain DOM builders:
java.lang.NullPointerException
at net.sf.saxon.om.NameOfNode.equals(NameOfNode.java:177)
at net.sf.saxon.om.SingletonAttributeMap.put(SingletonAttributeMap.java:69)
at net.sf.saxon.om.NodeInfo.attributes(NodeInfo.java:528)
at net.sf.saxon.tree.util.Navigator.copy(Navigator.java:673)
at net.sf.saxon.om.NodeInfo.copy(NodeInfo.java:568)
at net.sf.saxon.tree.util.Navigator.copy(Navigator.java:679)
at net.sf.saxon.om.NodeInfo.copy(NodeInfo.java:568)
at net.sf.saxon.event.ComplexContentOutputter.decompose(ComplexContentOutputter.java:860)
at net.sf.saxon.event.ComplexContentOutputter.append(ComplexContentOutputter.java:656)
The cause seems to be that node.getLocalName() for attribute type of nodes, returns null for Domino. Same setup works if DOM is converted to Tiny Tree or passed using a DOMWrapper to Saxon.
Xquery using domino, expected to work, threw Exception.
You've raised this on the Saxonica support forum at https://saxonica.plan.io/issues/5727
To summarise:
(a) Whether using the DOM wrapper in Saxon, or the Domino structure (which adds extra indexing), the DOM should be namespace-aware and should be constructed using namespace-aware (i.e. level-2) interfaces.
(b) If you don't follow that rule, we shouldn't crash (so we'll fix the crash that you've observed), but we can't guarantee delivering XPath-conformant results. The mapping from a non-namespace-aware DOM to a valid XDM instance is undefined and unpredictable, so the results of XPath processing are undefined. This might mean, for example, that when the result is serialized, it's not well-formed XML (for example, it might contain undeclared prefixes in element or attribute names.
I'm thinking of creating a VSCode extension to help people use a library I am creating. I've looked in 50 places and can only see documentation on getting the plain text of the document in which the completion suggestions are triggered.
My library exposes a function with two parameters, both objects with the same keys, but the first one will be defined already and the 2nd one will be passed in as an object literal. For example
const obj1 = {a:1, b:2};
doLibraryThing(obj1, {a:[], b:[]});
I want to provide code completion, or a snippet, or anything that can detect that doLibraryThing is being called, and know what properties were defined in obj1, even though usually it will be imported from another file; and then use those properties to generate the suggestion with the same properties, {a:[], b:[]}.
Is this possible?
How to convert the below Relative path to TestCafe Selector?
//a[contains(#name,'indent')]/parent::div//span[contains(text(),'Follow')]
If I try the above one, it recognizes specific DOM Component which contains multiple elements and one of those is 'Follow'.
how to achieve this using TestCafe Selectors.
I did not succeeded with the below one :
Selector('a').withAttribute('#name','indent').parent('div').child('span').contains('Follow')
Selector('a').withAttribute('#name','indent').parent('div').child('span').withText('Follow')
I checked your code and found a couple of possible causes, which can lead to the issue.
TestCafe Selectors do not have the contains method so the first example is incorrect.
Though I don't know your html structure, I can currently assume that there is no need to pass the # char in the attribute argument.
Thus your second example looks valid excepting the # char.
If this recommendation does not help, please provide us with a working example that shows the issue and create a separate bug report in the TestCafe repository using the following form
I want to know if passing a collection to the post of an ODataController is even possible before I waste my time trying to figure out where my problem is.
I've seen variations of this question over the internet, but nothing that has led me to an answer.
I created the Post method on an ODataContoller where I want to pass in a IEnumerable of a complex object. However, when I debug the controller, the parameter is null.
When I take each individual element of the collection and pass it into a Controller's Post (that takes a single object), the object is accepted. So I know the individual objects are being formatted correctly.
Technically this is possible. If you get null as complexObjects in the following call
[HttpPost]
public IHttpActionResult CreateMany([FromBody] IEnumerable<ComplexObject> complexObjects)
{
// ...
}
it's probably due to a format error in the bodies json object. If you have a working single object you can post, you just need to wrap it in brackets ... an array is an array even if it cotains only one element. This assumes, you check your web api actions via postman, fiddler etc., where you can 'compose' the entire request. Alternatively you can use the output of a 'GET all' action (if you have one) as input.
Regarding another aspect, the REST-fulness of list creation, you may find RESTful way to create multiple items in one request interesting
Hope this helps.
I have a custom node type for which I want to have a field that uses a special combobox based on list_text. When one chooses the type list_text it is normally possible to enter a static list of selectable texts, however, I want this list to be dynamic, i.e. based on the results of a db_query. What is the best way to do this using Drupal 7?
A simple example for clarification: A node of this custom type X contains a field that points to another node, so whenever a node of type X is created I want a combobox that contains all other nodes.
(Best solution would be to only display the combobox during node creation, and no longer during edit. But I could also live with it if the combobox was shown during the edit as well.)
I have tried to customize options_select by defining my own data type and implementing hook_options_list accordingly. The combobox was displayed during creation with the correct values, however, I could not save it.. I have no idea what went wrong there, but on the first submit it would change to a different theme, and when I tried again I got an internal server error. Am I on the right track at all with defining a completely new data type for the field? there surely must be a simpler way?
You're right in that you don't need a new datatype. Here's a good tutorial on how to do this. It's not specifically for D7 but I didn't see much that wasn't still applicable. There may be a better way to do it in D7 specifically but I would love to know it too if so :)
The tutorial linked by allegroconmolto sent me on the right way. Thanks for that.
Here's the simpler way of doing it: tutorial
Basically, it is, as I assumed, a common problem and hence a simple solution for it was included in the webform module by now. It provides a hook_webform_select_options_info which can be used to register a callback method. The callback method is then called each time a corresponding option select of a webform is shown, so that you can easily fill it with the results of a dbquery or anything else. Works like a charm and takes next to no time to implement.