This issue came-up after resolving an IIS validation issue described here - ArcGIS JSAPI Print/Validation Issue: SyntaxError: Unexpected token <
It seems similar to an issue reported awhile back here - Print Task fails with default Selected Point Graphic
To replicate the issue, because a proxy is involved (and I wasn't able to hit the Esri proxy outside of an Esri domain), you'll have to use sandbox and manually paste code:
ArcGIS API for JavaScript Sandbox
1) Copy the following code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<meta name="description" content="[Print webmap]">
<!--
ArcGIS API for JavaScript, https://js.arcgis.com
For more information about the widget_print_webmap sample, read the original sample description at developers.arcgis.com.
https://developers.arcgis.com/javascript/3/widget_print_webmap/index.html
-->
<title>Print webmap</title>
<link rel="stylesheet" href="https://js.arcgis.com/3.20/dijit/themes/tundra/tundra.css">
<link rel="stylesheet" href="https://js.arcgis.com/3.20/esri/css/esri.css">
<style>
html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
h3 { margin: 0 0 5px 0; border-bottom: 1px solid #444; padding: 0 0 5px 0; text-align: center; }
.shadow {
-moz-box-shadow: 0 0 5px #888;
-webkit-box-shadow: 0 0 5px #888;
box-shadow: 0 0 5px #888;
}
#map{ margin: 0; padding: 0; }
#feedback {
background: #fff;
border: 2px solid #666;
border-radius: 5px;
bottom: 20px;
color: #666;
font-family: arial;
height: auto;
left: 20px;
margin: 5px;
padding: 10px;
position: absolute;
width: 300px;
z-index: 40;
}
#feedback a {
border-bottom: 1px solid #888;
color: #666;
text-decoration: none;
}
#feedback a:hover, #feedback a:active, #feedback a:visited {
border: none;
color: #666;
text-decoration: none;
}
#note { padding: 0 0 10px 0; }
#info { padding: 10px 0 0 0; }
</style>
<script src="https://js.arcgis.com/3.20/"></script>
<script>
var app = {};
require([
"esri/arcgis/utils", "esri/dijit/Print",
"esri/tasks/PrintTemplate", "esri/config",
"dojo/_base/array", "dojo/dom", "dojo/parser", "esri/dijit/Search",
"dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!"
], function(
arcgisUtils, Print,
PrintTemplate, esriConfig,
arrayUtils, dom, parser, Search
) {
parser.parse();
app.webmapId = "523e292002294392a36d888a9780a731";
app.printUrl = "https://sampleserver6.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%...";
esriConfig.defaults.io.proxyUrl = "/proxy/";
var webmap = arcgisUtils.createMap(app.webmapId, "map", {
mapOptions: {
center: [-85.673, 38.21],
zoom: 10
}
});
webmap.then(function(resp) {
app.mapInfo = resp.itemInfo.item;
app.map = resp.map;
createPrintDijit(app.mapInfo.title);
createSearch();
});
function createSearch(){
var search = new Search({
map: app.map
}, "search");
search.startup();
}
function createPrintDijit(printTitle) {
var layoutTemplate, templateNames, mapOnlyIndex, templates;
// create an array of objects that will be used to create print templates
var layouts = [{
name: "Letter ANSI A Landscape",
label: "Landscape (PDF)",
format: "pdf",
options: {
legendLayers: [], // empty array means no legend
scalebarUnit: "Miles",
titleText: printTitle + ", Landscape PDF"
}
}, {
name: "Letter ANSI A Portrait",
label: "Portrait (Image)",
format: "jpg",
options: {
legendLayers: [],
scalebarUnit: "Miles",
titleText: printTitle + ", Portrait JPG"
}
}];
// create the print templates
var templates = arrayUtils.map(layouts, function(lo) {
var t = new PrintTemplate();
t.layout = lo.name;
t.label = lo.label;
t.format = lo.format;
t.layoutOptions = lo.options;
return t;
});
app.printer = new Print({
map: app.map,
templates: templates,
url: app.printUrl
}, dom.byId("print_button"));
app.printer.startup();
}
});
</script>
</head>
<body class="tundra">
<div id="search"></div>
<div data-dojo-type="dijit/layout/BorderContainer"
data-dojo-props="design:'headline',gutters:false"
style="width: 100%; height: 100%; margin: 0;">
<div id="map"
data-dojo-type="dijit/layout/ContentPane"
data-dojo-props="region:'center'">
<div id="feedback">
<h3>
ArcGIS.com Webmap and the Print Dijit
</h3>
<div id="info">
<div id="note">
Note: This sample uses an ArcGIS Server version 10.1 export web map task.
</div>
<div id="print_button"></div>
<div id="info">
The map is <a href="https://developers.arcgis.com/javascript/3/jsapi/esri.arcgis.utils-amd.html#createmap">created from an ArcGIS.com webmap</a> and
<a href="https://developers.arcgis.com/javascript/3/jsapi/printtemplate-amd.html">print templates</a> are
created manually. Refer to the documentation for more print template options (output formats, additional layouts, etc.).
</div>
</div>
</div>
</div>
</div>
</body>
</html>
2) Paste into the print widget sandbox example
3) Click "refresh" in the sandbox window
4) Print the page (PDF) without searching an address, which is successful
-> Notice the following URL is hit in Fiddler (non proxy) -https://sampleserver6.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export...
-> Here's the JSON sent:
{
"mapOptions" : {
"showAttribution" : true,
"extent" : {
"xmin" : -9602504.8309441,
"ymin" : 4580852.692386033,
"xmax" : -9471644.63851983,
"ymax" : 4637416.093317086,
"spatialReference" : {
"wkid" : 102100
}
},
"spatialReference" : {
"wkid" : 102100
},
"scale" : 577790.5542889973
},
"operationalLayers" : [{
"id" : "World_Ocean_Base_5811",
"title" : "World_Ocean_Base",
"opacity" : 1,
"minScale" : 591657527.591555,
"maxScale" : 9027.977411,
"url" : "https://services.arcgisonline.com/arcgis/rest/services/Ocean/World_Ocean_Base/MapServer"
}, {
"id" : "LOJIC_LandRecords_Louisville_4506",
"title" : "LOJIC_LandRecords_Louisville",
"opacity" : 0.28,
"minScale" : 0,
"maxScale" : 0,
"url" : "https://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Louisville/LOJIC_LandRecords_Louisville/...",
"visibleLayers" : [0, 2]
}, {
"id" : "World_Ocean_Reference_1604",
"title" : "World_Ocean_Reference",
"opacity" : 1,
"minScale" : 591657527.591555,
"maxScale" : 9027.977411,
"url" : "https://services.arcgisonline.com/arcgis/rest/services/Ocean/World_Ocean_Reference/MapServer"
}
],
"exportOptions" : {
"outputSize" : [800, 1100],
"dpi" : 96
},
"layoutOptions" : {
"titleText" : "Louisville – Land Records, Landscape PDF",
"scaleBarOptions" : {
"metricUnit" : "esriKilometers",
"metricLabel" : "km",
"nonMetricUnit" : "esriMiles",
"nonMetricLabel" : "mi"
},
"legendOptions" : {
"operationalLayers" : []
}
}
}
5) Click "refresh" in the sandbox to reload
6) In the Search widget:
-> "Louisville, Kentucky, United States"
-> Search
7) Allow the geocode/plot process to complete (don't close anything)
😎 Print the page (PDF) after searching, which is not successful
-> Notice the following URL is hit in Fiddler (proxy) - https://developers.arcgis.com/proxy/?https://sampleserver6.arcgisonline.com/arcgis/rest/services/Uti...
-> Here's the JSON sent:
{
"mapOptions" : {
"showAttribution" : true,
"extent" : {
"xmin" : -9579408.788718093,
"ymin" : 4599781.962824823,
"xmax" : -9513978.692506071,
"ymax" : 4631044.707393419,
"spatialReference" : {
"wkid" : 102100
}
},
"spatialReference" : {
"wkid" : 102100
},
"scale" : 288895.27714399697
},
"operationalLayers" : [{
"id" : "World_Ocean_Base_5811",
"title" : "World_Ocean_Base",
"opacity" : 1,
"minScale" : 591657527.591555,
"maxScale" : 9027.977411,
"url" : "https://services.arcgisonline.com/arcgis/rest/services/Ocean/World_Ocean_Base/MapServer"
}, {
"id" : "LOJIC_LandRecords_Louisville_4506",
"title" : "LOJIC_LandRecords_Louisville",
"opacity" : 0.28,
"minScale" : 0,
"maxScale" : 0,
"url" : "https://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Louisville/LOJIC_LandRecords_Louisville/...",
"visibleLayers" : [0, 2]
}, {
"id" : "map_graphics",
"opacity" : 1,
"minScale" : 0,
"maxScale" : 0,
"featureCollection" : {
"layers" : [{
"layerDefinition" : {
"name" : "pointLayer",
"geometryType" : "esriGeometryPoint"
},
"featureSet" : {
"geometryType" : "esriGeometryPoint",
"features" : [{
"geometry" : {
"x" : -9546693.6798316,
"y" : 4615403.733083267,
"spatialReference" : {
"wkid" : 102100
}
},
"symbol" : {
"color" : [0, 0, 0, 0],
"size" : 12,
"angle" : 0,
"xoffset" : 6.75,
"yoffset" : 13.5,
"type" : "esriSMS",
"outline" : {
"color" : [0, 255, 255, 255],
"width" : 1.5,
"type" : "esriSLS",
"style" : "esriSLSSolid"
}
}
}, {
"geometry" : {
"x" : -9546693.6798316,
"y" : 4615403.733083267,
"spatialReference" : {
"wkid" : 102100
}
},
"attributes" : {
"Addr_type" : "POI",
"Match_addr" : "Louisville, Kentucky, United States",
"StAddr" : "",
"City" : "",
"score" : 100,
"searchTheme" : "arcgisSearch",
"searchResult" : "Louisville, Kentucky, United States",
"searchMoreResults" : "moreResults",
"searchMoreResultsItem" : "moreItem",
"searchMoreResultsId" : "search_more_results",
"searchMoreResultsHtml" : ""
},
"symbol" : {
"angle" : 0,
"xoffset" : 6.75,
"yoffset" : 13.5,
"type" : "esriPMS",
"url" : "https://js.arcgis.com/3.20/esri/dijit/Search/images/search-pointer.png",
"width" : 27,
"height" : 27
},
"infoTemplate" : {
"title" : "Search result",
"content" : "<div class=\"${searchTheme}\"><div id=\"${searchMoreResultsId}\" class=\"${searchMoreResults}\"><div class=\"${searchMoreResultsItem}\">${searchResult}</div><div>${searchMoreResultsHtml}</div></div></div>"
}
}
]
}
}
]
}
}, {
"id" : "World_Ocean_Reference_1604",
"title" : "World_Ocean_Reference",
"opacity" : 1,
"minScale" : 591657527.591555,
"maxScale" : 9027.977411,
"url" : "https://services.arcgisonline.com/arcgis/rest/services/Ocean/World_Ocean_Reference/MapServer"
}
],
"exportOptions" : {
"outputSize" : [800, 1100],
"dpi" : 96
},
"layoutOptions" : {
"titleText" : "Louisville – Land Records, Landscape PDF",
"scaleBarOptions" : {
"metricUnit" : "esriKilometers",
"metricLabel" : "km",
"nonMetricUnit" : "esriMiles",
"nonMetricLabel" : "mi"
},
"legendOptions" : {
"operationalLayers" : []
}
}
}
-> Notice the error in console (print does not complete):
-> Error: Unable to complete operation.
-> This will probably manifest on the server as an error like this:
9) Now, close the infoWindow only
10) Print the page (PDF), which should complete successfully (it does not hit the proxy)
-> Here's the URL hit (again, notice no proxy this time) - https://sampleserver6.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%...
-> Here's the JSON sent:
{
"mapOptions" : {
"showAttribution" : true,
"extent" : {
"xmin" : -9579408.788718093,
"ymin" : 4599781.962824823,
"xmax" : -9513978.692506071,
"ymax" : 4631044.707393419,
"spatialReference" : {
"wkid" : 102100
}
},
"spatialReference" : {
"wkid" : 102100
},
"scale" : 288895.27714399697
},
"operationalLayers" : [{
"id" : "World_Ocean_Base_5811",
"title" : "World_Ocean_Base",
"opacity" : 1,
"minScale" : 591657527.591555,
"maxScale" : 9027.977411,
"url" : "https://services.arcgisonline.com/arcgis/rest/services/Ocean/World_Ocean_Base/MapServer"
}, {
"id" : "LOJIC_LandRecords_Louisville_4506",
"title" : "LOJIC_LandRecords_Louisville",
"opacity" : 0.28,
"minScale" : 0,
"maxScale" : 0,
"url" : "https://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Louisville/LOJIC_LandRecords_Louisville/...",
"visibleLayers" : [0, 2]
}, {
"id" : "map_graphics",
"opacity" : 1,
"minScale" : 0,
"maxScale" : 0,
"featureCollection" : {
"layers" : [{
"layerDefinition" : {
"name" : "pointLayer",
"geometryType" : "esriGeometryPoint"
},
"featureSet" : {
"geometryType" : "esriGeometryPoint",
"features" : [{
"geometry" : {
"x" : -9546693.6798316,
"y" : 4615403.733083267,
"spatialReference" : {
"wkid" : 102100
}
},
"attributes" : {
"Addr_type" : "POI",
"Match_addr" : "Louisville, Kentucky, United States",
"StAddr" : "",
"City" : "",
"score" : 100,
"searchTheme" : "arcgisSearch",
"searchResult" : "Louisville, Kentucky, United States",
"searchMoreResults" : "moreResults",
"searchMoreResultsItem" : "moreItem",
"searchMoreResultsId" : "search_more_results",
"searchMoreResultsHtml" : ""
},
"symbol" : {
"angle" : 0,
"xoffset" : 6.75,
"yoffset" : 13.5,
"type" : "esriPMS",
"url" : "https://js.arcgis.com/3.20/esri/dijit/Search/images/search-pointer.png",
"width" : 27,
"height" : 27
},
"infoTemplate" : {
"title" : "Search result",
"content" : "<div class=\"${searchTheme}\"><div id=\"${searchMoreResultsId}\" class=\"${searchMoreResults}\"><div class=\"${searchMoreResultsItem}\">${searchResult}</div><div>${searchMoreResultsHtml}</div></div></div>"
}
}
]
}
}
]
}
}, {
"id" : "World_Ocean_Reference_1604",
"title" : "World_Ocean_Reference",
"opacity" : 1,
"minScale" : 591657527.591555,
"maxScale" : 9027.977411,
"url" : "https://services.arcgisonline.com/arcgis/rest/services/Ocean/World_Ocean_Reference/MapServer"
}
],
"exportOptions" : {
"outputSize" : [800, 1100],
"dpi" : 96
},
"layoutOptions" : {
"titleText" : "Louisville – Land Records, Landscape PDF",
"scaleBarOptions" : {
"metricUnit" : "esriKilometers",
"metricLabel" : "km",
"nonMetricUnit" : "esriMiles",
"nonMetricLabel" : "mi"
},
"legendOptions" : {
"operationalLayers" : []
}
}
}
-> Here's a BC difference between the last two requests:
This looks like a genuine bug to me! Any ideas?
Thanks!
Just a follow-up, I am working around this by hiding the infoWindow before the export initiates, then showing after modifying ioArgs within Esri request (which I needed to do for my other issue - https://community.esri.com/thread/193761-arcgis-jsapi-printvalidation-issue-syntaxerror-unexpected-t... ). This looks similar to how infoWindow is handled for map services, when rendered during print exec.
I'm going to mark this as "assumed answered" for now, but I notified Esri of the bug.
Esri confirmed it was a bug:
BUG-000104782 - Getting error "Unable to complete operation" while printing searched location using Search Widget
Hello Chris,
I just wanted to follow up regarding this bug BUG-000104782.
In my testing using the same steps, you provided above, it looks like it is fixed on Javascript API 3.21
Can you please test this on your side to see if this is working for you too?
Thank you,
Erwin
Thanks – as soon as I have the time to test, I’ll give it a go and report my findings.
Regards,
Chris Smith
Programmer/Analyst
727.786.7955 phone ext. 251 | 727.786.5871 fax | csmith@geosolinc.com <mailto:csmith@geosolinc.com%20 >
1001 Omaha Circle, Palm Harbor, FL 34683 | geographicsolutions.com<http://www.geographicsolutions.com/>
<http://www.geographicsolutions.com/>
The information contained in this message may be privileged, confidential
and protected from disclosure. If the reader of this message is not the intended
recipient, or an employee or agent responsible for delivering this message to the
intended recipient, you are hereby notified that any dissemination, distribution
or copying of this communication is strictly prohibited. If you have received this
communication in error, please notify us immediately by replying to the message
and deleting it from your computer.