I'm evaluating upgrading an existing application from 4.15 to 4.16, and we discovered a bug in the symbolUtils.renderPreviewHTML when the symbol is a fill symbol, and the fill style is not "solid" - the image URL for the preview is "https://symbols/patterns/{style}.png", which fails to resolve and logs errors to the console.
here is a simple HTML page that will demonstrate this error:
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Symbol Preview not working</title>
<style>
html, body {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
#viewDiv {
height: 50%;
}
</style>
<link rel="stylesheet" href="https://js.arcgis.com/4.16/esri/css/main.css">
<script src="https://js.arcgis.com/4.16/"></script>
<script>
require([
"esri/Map",
"esri/views/MapView",
"esri/symbols/support/symbolUtils",
"esri/symbols/Symbol"
], function(Map, MapView, symbolUtils, Symbol) {
var map = new Map({
basemap: "topo-vector"
});
var view = new MapView({
container: "viewDiv",
map: map,
center: [-118.71511,34.09042],
zoom: 11
});
var symbolDefinition = {
color: "#9814F0",
outline: {color: "#23F01A", style: "solid", width: 1},
style: "diagonal-cross",
type: "simple-fill"
};
var s = new Symbol(symbolDefinition);
symbolUtils.renderPreviewHTML(s, {
node: document.getElementById("symbolPreviewDiv"),
size: s.size ? s.size : 12
});
});
</script>
</head>
<body>
<div id="viewDiv"></div>
<div id="symbolPreviewDiv"></div>
</body>
</html>
