classIdPrefix doesn't work when your svg's style block contains keyframes

[avshyz]

It seems as if, for some reason, the function processStyles of prefix-style-class-id.js breaks when you import an SVG that has keyframes in its style block.
It seems as if the function tries to process rule.selectors, but fails because the svg with the keyframe's selectors is null.

here's the full trace

ERROR in ./src/resources/svg/line.svg
Module build failed: TypeError: Cannot read property 'map' of undefined
    at <PROJECT_DIR>/node_modules/svg-react-loader/lib/sanitize/filters/prefix-style-class-id.js:27:17
    at Array.forEach (<anonymous>)
    at processStyles (<PROJECT_DIR>/node_modules/svg-react-loader/lib/sanitize/filters/prefix-style-class-id.js:19:9)
    at <PROJECT_DIR>/node_modules/svg-react-loader/lib/sanitize/filters/prefix-style-class-id.js:63:32
    at Array.map (<anonymous>)
    at Object.prefixStyleClassId (<PROJECT_DIR>/node_modules/svg-react-loader/lib/sanitize/filters/prefix-style-class-id.js:61:17)
    at Object.<anonymous> (<PROJECT_DIR>/node_modules/svg-react-loader/lib/sanitize/index.js:25:20)
    at Array.forEach (<anonymous>)
    at Object.<anonymous> (<PROJECT_DIR>/node_modules/svg-react-loader/lib/sanitize/index.js:24:13)
    at walker (<PROJECT_DIR>/node_modules/traverse/index.js:190:22)
    at <PROJECT_DIR>/node_modules/traverse/index.js:208:29
    at Array.forEach (<anonymous>)
    at forEach (<PROJECT_DIR>/node_modules/traverse/index.js:298:31)
    at walker (<PROJECT_DIR>/node_modules/traverse/index.js:203:13)
    at <PROJECT_DIR>/node_modules/traverse/index.js:208:29
    at Array.forEach (<anonymous>)
 @ ./src/utils/grids.js 38:12-48
 @ ./src/selectors/reports.js
 @ ./src/sagas/bookmarks.js
 @ ./src/sagas/index.js
 @ ./src/utils/init.js
 @ ./src/index.jsx
 @ multi (webpack)-dev-server/client?http://localhost:6593 webpack/hot/dev-server babel-polyfill react-hot-loader/patch ./src/index.jsx

Here's the content of the file line.svg.

<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="10" id="HJARZIaGZf">
    <style>
        #Bk1xRb8aGbf{fill: #CCCCCC;}

	@keyframes Bk1xRb8aGbfAnimation {
		0% {
			opacity: 1;
		}
		50% {
			opacity: 0.35;
		}
		100% {
			opacity: 1;
		}
	}

	#Bk1xRb8aGbf {
		transform-origin: 50% 50% !important;
		animation: Bk1xRb8aGbfAnimation 1s infinite linear;
	}
    </style>
    <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="10" id="HJARZIaGZf">
        <rect width="100%" height="10" fill-rule="evenodd" rx="5" id="Bk1xRb8aGbf"/>
    </svg>
</svg>

After commenting out the keyframes, no error was seen.
After introducing a keyframe to other svg files - the error came back

[mike-sudyn]

Did you found any workaround?