Wkhtmltopdf patched QT issue with angularjs - angularjs

I get this JavaScript error when running any version of wkhtmltopdf with patched Qt:
Warning: undefined:0 Error: [$injector:modulerr] Failed to instantiate module ng due to:
'undefined' is not an object
http://errors.angularjs.org/1.5.7/$injector/modulerrp0=ng&p1='undefined'%20is%20not%20an%20object
(I'm trying to render a page with angularjs 1.5).
When I use a version of wkhtmltopdf without patched Qt I don't get the error and everything works fine.
I use this heroku buildpack which installs version 0.12.3 with patched Qt, and I got this error.
Any idea how to solve my problem? I may install wkhtmltopdf without patched Qt on production but it seems I will have to compile it...

I finally managed to make it work with all versions: I needed a special version of the .bind() JavaScript function polyfill:
var isFunction = function (o) {
return typeof o == 'function';
};
var bind,
slice = [].slice,
proto = Function.prototype,
featureMap;
featureMap = {
'function-bind': 'bind'
};
function has(feature) {
var prop = featureMap[feature];
return isFunction(proto[prop]);
}
// check for missing features
if (!has('function-bind')) {
// adapted from Mozilla Developer Network example at
// https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/bind
bind = function bind(obj) {
var args = slice.call(arguments, 1),
self = this,
nop = function() {
},
bound = function() {
return self.apply(this instanceof nop ? this : (obj || {}), args.concat(slice.call(arguments)));
};
nop.prototype = this.prototype || {}; // Firefox cries sometimes if prototype is undefined
bound.prototype = new nop();
return bound;
};
proto.bind = bind;
}

Related

How can I replace the bower package jsTimezoneDetect in npm

I am trying to replace bower in my repo and I am having trouble replacing this package: "jsTimezoneDetect": "1.0.4". The suggested package to replace this is "jstimezonedetect": "^1.0.6". I am using this package as shown here:
var missionJoin = {
timeZoneId : jstz.determine().name()
};
This however, gives me this error:
ReferenceError: Can't find variable: Intl in node_modules/jstimezonedetect/dist/jstz.js (line 124)
get_from_internationalization_api#node_modules/jstimezonedetect/dist/jstz.js:124:22
determine#node_modules/jstimezonedetect/dist/jstz.js:412:67
joinMission#app/scripts/controllers/robo.profile.ProfileServiceCtrl.js:1:27975
test/specs/robo.profile.profileServiceCtrl.spec.js:151:27
<Jasmine>
This package does not have any dependencies and the error seems to come from a problem in the package itself. Is there something I am doing wrong here? Has anyone else faced a similar issue? Any help would be greatly appreciated!
For anyone who might face this problem in the future, here is how I got around this issue:
Found in the last paragraph of https://github.com/iansinnott/jstz
export function findTimeZone() {
const oldIntl = window.Intl
try {
window.Intl = undefined
const tz = jstz.determine().name()
window.Intl = oldIntl
return tz
} catch (e) {
// sometimes (on android) you can't override intl
return jstz.determine().name()
}
}
and
var missionJoin = {
timeZoneId : findTimeZone()
};

How to import minified js file on react create app

So I have this Create react app (I don't really understand webpack), and I wanted to use EaselJS on this one, However the NPM counterpart of EselJS is their version 2 (BETA) and is quite unstable and undocumented - That's why I wanted to use the minified version.
I have a easeljs.min.js on my project but I don't know how to "import it".
doing `import './easeljs.min.js' seems to also generate a lot of linting issues and seems to nor work.
EDIT:
I tried using react-helmet and append it as a script tag, but it seems that react is doing something with the minified version and causes it to error. (unexpected token <)
So I was able to fix it:
I installed react-app-rewired created config-overrides.js and added this code:
module.exports = function override(config, env) {
if (!config.resolve || Object.keys(config.resolve).length === 0) {
config.resolve = {};
}
if (!config.module || Object.keys(config.module).length === 0) {
config.module = {};
}
if (!config.module.rules || config.module.rules.length === 0) {
config.module.rules = [];
}
const resolve = {
alias: {
createjs: "createjs/builds/1.0.0/createjs.js"
}
};
config.resolve = {
...config.resolve,
...resolve
};
config.module.rules.push({
test: /node_modules[/\\]createjs/,
loaders: ["imports-loader?this=>window", "exports-loader?window.createjs"]
});
return config;
};
It seems that it is an issue with createjs itself https://github.com/CreateJS/Combined/issues/12
I also ended up using this repo for createjs.

importScripts in Web Workers is undefined inside a React/Webpack environment

I am working on a React app created with create-react-app. I was having trouble creating a web worker in it so I posted a question here on SO: Creating a web worker inside React
I've found a solution, as written in the post above, to load a worker without ejecting the app and messing with the Webpack config. This is the code, from the post above:
// worker.js
const workercode = () => {
self.onmessage = function(e) {
console.log('Message received from main script');
const workerResult = 'Received from main: ' + (e.data);
console.log('Posting message back to main script');
self.postMessage(workerResult);
}
};
let code = workercode.toString();
code = code.substring(code.indexOf("{")+1, code.lastIndexOf("}"));
const blob = new Blob([code], {type: "application/javascript"});
const worker_script = URL.createObjectURL(blob);
module.exports = worker_script;
and in the file that uses the worker:
import worker_script from './worker';
const myWorker = new Worker(worker_script);
myWorker.onmessage = (m) => {
console.log("msg from worker: ", m.data);
};
myWorker.postMessage('im from main');
It works, however, I cannot seem to get importScripts to work. Even if I do this (outside onmessage or inside onmessage):
if (typeof importScripts === 'function') {
importScripts('myscript.js');
}
In that case, the if statement turns out to be true, but then fails on the actual import with the same error message 'importScripts' is not defined as if the if statement is a false positive, which doesn't sound right. I'd say this is a context issue and that the worker probably isn't loading properly (although it seems to work), but it's just a guess.
Any ideas what's happening here?
importScripts in a worker created from Blob works fine, at least in 2021 (react 17.0.2, react-scripts 4.0.3, Chrome 92). The imported script URL must be absolute because worker was created from Blob.
The original issue might have been a bug in webpack or the transpilation might have changed the code in a weird way.
const workercode = () => {
importScripts("https://example.com/extra.js");
console.log(self.extraValue); // 10
self.onmessage = function(e) {
console.log('Message received from main script');
...
}
};
 
// extra.js
self.extraValue = 10;
Looks like this is still broken in 2022 - Seems there is a regression coming down the dev pipeline (at least in Android WebView and possibly some dev/canary chrome verions.)
https://bugs.chromium.org/p/chromium/issues/detail?id=1078821

Error: Cannot find module 'react/lib/Object.assign' from dispatcher

Below is my dispatcher code
var Dispatcher = require("flux").Dispatcher;
var assign = require("react/lib/Object.assign");
var AppDispatcher = assign(new Dispatcher(), {
handleViewAction: function(action){
console.log('action', action)
this.dispatch({
source: 'VIEW_ACTION',
action: action
})
}
});
module.exports = AppDispatcher;
gulp is not starting it is throwing error
Error: Cannot find module 'react/lib/Object.assign' from '/Users/shanky-munjal/projects/testFlux/src/js/dispatchers'
at /Users/shanky-munjal/projects/testFlux/node_modules/browserify/node_modules/resolve/lib/async.js:46:17
at process (/Users/shanky-munjal/projects/testFlux/node_modules/browserify/node_modules/resolve/lib/async.js:173:43)
at ondir (/Users/shanky-munjal/projects/testFlux/node_modules/browserify/node_modules/resolve/lib/async.js:188:17)
at load (/Users/shanky-munjal/projects/testFlux/node_modules/browserify/node_modules/resolve/lib/async.js:69:43)
at onex (/Users/shanky-munjal/projects/testFlux/node_modules/browserify/node_modules/resolve/lib/async.js:92:31)
at /Users/shankymunjal/projects/testFlux/node_modules/browserify/node_modules/resolve/lib/async.js:22:47
at FSReqWrap.oncomplete (fs.js:82:15)
I am using react 15.2.1
use Object.assign
A long time ago Dan Abramov wrote:
This is a gentle reminder that require('react/lib/SomeInternalModule')
in your component will break in some release regardless of semver.
npm install object-assign --save
this code will work
var assign = require("react/lib/Object.assign");
this code instead of
var assign = require("Object-assign");

If my ExtJS 4.2 sencha build app succeeds, why am I getting error at runtime?

I've been trying to setup using Sencha Cmd for our ExtJS 4.2.2 project, and the build completes successfully, but when I try to run the app I get this:
TypeError: comp is null
I'm running the testing build, so the app.js is concatenated but not minified.
Same thing happens if I run the production build.
If I execute from my raw source code files, the app runs fine.
Its happening in this code in the generated app.js:
/**
* Creates new LoadMask.
* #param {Object} [config] The config object.
*/
constructor : function(config) {
var me = this,
comp;
if (arguments.length === 2) {
if (Ext.isDefined(Ext.global.console)) {
Ext.global.console.warn('Ext.LoadMask: LoadMask now uses a standard 1 arg constructor: use the target config');
}
comp = config;
config = arguments[1];
} else {
comp = config.target;
}
// Element support to be deprecated
if (!comp.isComponent) {
if (Ext.isDefined(Ext.global.console)) {
Ext.global.console.warn('Ext.LoadMask: LoadMask for elements has been deprecated, use Ext.dom.Element.mask & Ext.dom.Element.unmask');
}
comp = Ext.get(comp);
this.isElement = true;
}
me.ownerCt = comp;
if (!this.isElement) {
me.bindComponent(comp);
}
me.callParent([config]);
if (me.store) {
me.bindStore(me.store, true);
}
},

Resources