We Keep Coding

Blockly doesn't properly remove fields

In the image i have the block. When a username/tag is selected it should remove the fields but it just doesn't. When the else code block runs the fields exist, but it still doesnt remove anything it just stays there.
everything works except the field remover.
Thanks, for your support!
block data:
const blockData = {
"message0": "%1 %2 %3",
"args0": [
{
"type": "input_dummy"
},
{
"type": "field_dropdown",
"name": "MODE",
"options": [
["username", "USERNAME"],
["tag", "TAG"],
["avatarURL", "AVATARURL"],
["bannerURL", "BANNERURL"],
["createDM", "CREATEDM"],
["deleteDM", "DELETEDM"]
]
},
{
"type": "input_dummy",
"name": "test",
},
],
"previousStatement": null,
"nextStatement": null,
"colour": "#40BF4A",
"tooltip": "Set the timestamp of an embed.",
"helpUrl": "",
};
const stringArr = [ "AVATARURL", "DELETEDM", "CREATEDM", "BANNERURL"]
function removeInputs(exclude, block) {
for(let str of stringArr) {
if(str != exclude) if(block.getField(str)) block.removeInput(str)
}
}
Blockly.Blocks[blockName] = {
init: function() {
this.jsonInit(blockData);
},
onchange: function(ev) {
let field = ev.newValue
if(stringArr.includes(field)) {
switch(field) {
case "AVATARURL":
if(!this.getField("AVATARURL")) this.appendValueInput("AVATARURL").setCheck("Boolean").setAlign(Blockly.ALIGN_RIGHT);
removeInputs("AVATARURL", this)
break;
case "CREATEDM":
if(!this.getField("CREATEDM")) this.appendValueInput("CREATEDM").setCheck("Boolean").setAlign(Blockly.ALIGN_RIGHT);
removeInputs("CREATEDM", this)
break;
case "DELETEDM":
if(!this.getField("DELETEDM")) this.appendValueInput("DELETEDM").setCheck("Boolean").setAlign(Blockly.ALIGN_RIGHT);
removeInputs("DELETEDM", this)
break;
case "BANNERURL":
if(!this.getField("BANNERURL")) this.appendValueInput("BANNERURL").setCheck("Boolean").setAlign(Blockly.ALIGN_RIGHT);
removeInputs("BANNERURL", this)
break;
}
}
else {
if(this.getField("BANNERURL")) this.removeInput("BANNERURL")
if(this.getField("DELETEDM")) this.removeInput("DELETEDM")
if(this.getField("CREATEDM")) this.removeInput("CREATEDM")
if(this.getField("AVATARURL")) this.removeInput("AVATARURL")
}
}
};
Block image

Two output files share the same path but have different contents

I've come across this error when building grammar for a parser, using nearley.js. I have three files: grammar.ne, grammar.js, and parser.js. The full error is below:
$ ./.config/build.sh
> error: Two output files share the same path but have different contents: .build/grammar.js.map
> error: Two output files share the same path but have different contents: .build/grammar.js
exit status 1
Here are the contents of each of the files:
grammar.ne:
main -> (statement "\n"):+
statement -> "foo" | "bar"
grammar.js:
// Generated automatically by nearley, version 2.20.1
// http://github.com/Hardmath123/nearley
import Lexer from './lexer';
(function() {
function id(x) { return x[0]; }
var grammar = {
Lexer: Lexer,
ParserRules: [
{ "name": "main$ebnf$1$subexpression$1", "symbols": ["statement", { "literal": "\n" }] },
{ "name": "main$ebnf$1", "symbols": ["main$ebnf$1$subexpression$1"] },
{ "name": "main$ebnf$1$subexpression$2", "symbols": ["statement", { "literal": "\n" }] },
{ "name": "main$ebnf$1", "symbols": ["main$ebnf$1", "main$ebnf$1$subexpression$2"], "postprocess": function arrpush(d) { return d[0].concat([d[1]]); } },
{ "name": "main", "symbols": ["main$ebnf$1"] },
{ "name": "statement$string$1", "symbols": [{ "literal": "f" }, { "literal": "o" }, { "literal": "o" }], "postprocess": function joiner(d) { return d.join(''); } },
{ "name": "statement", "symbols": ["statement$string$1"] },
{ "name": "statement$string$2", "symbols": [{ "literal": "b" }, { "literal": "a" }, { "literal": "r" }], "postprocess": function joiner(d) { return d.join(''); } },
{ "name": "statement", "symbols": ["statement$string$2"] }
]
, ParserStart: "main"
}
if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
module.exports = grammar;
} else {
grammar = grammar;
}
})();
const nearley = require("nearley");
const grammar = require("./grammar.js");
const parser = new nearley.Parser(nearley.Grammar.fromCompiled(grammar));
parser.feed("foo\n");
console.log(JSON.stringify(parser.results));
Nothing that I have found online has helped at all. This is built in a TypeScript repl, and I have a lexer written in TypeScript, if that helps any.

I figured out the issue. In my package.json, I had used the module "es2015" when I should have been using "commonjs". I then changed the file extension of grammar.js to .cjs, and that got rid of all of the automatically-generated code errors. I also added a script to the package json npx nearleyc grammar.ne -o grammar.cjs && node parser.cjs, which allows me to execute compiling the grammar file faster, and uses the new .cjs extension to compile it to a CommonJS module; this also allows me to run the test file at the same time.

Chrome Extension - Running Javascript from Right Click Menu [duplicate]

This question already has an answer here:
Chrome Extension Context Menu: how to append div to page after clicking menu item
(1 answer)
Closed 5 years ago.
I am writing a simple Chrome Extension which enables disabled drop-down menus.
If I ran this same script in the Console, it works perfectly. However, through the extension it calls the functions but doesn't do anything.
Thank you in advance for your help.
manifest.json
{
"name": "4x6 Mac Menu",
"manifest_version": 2
"version": "0.1.4",
"description": "Overrides Disabled Drop Down",
"permissions": ["contextMenus"],
"background": {
"scripts": ["sample-click.js"]
}
}
sample-click.js
function Enable46(info, tab) {
console.log("Enable 4x6 was clicked.");
var inputs = document.getElementsByClassName('psSelect');
for(var i = 0; i < inputs.length; i++) {
inputs[i].disabled = false;
}
console.log("Drop Enabled.");
}
chrome.contextMenus.create({
title: "Enable 4x6",
contexts: ["page"],
onclick: Enable46,
});
I also tried another approach to have a listener as background and while I get the console log, the event doesn't actually carry out the function
manifest.json
{
"name": "4x6 Enable",
"description": "Enable 4x6 Print Option on Mac",
"version": "0.1",
"manifest_version": 2,
"permissions": [
"contextMenus",
"activeTab"
],
"background": {
"persistent": false,
"scripts": ["bg.js"]
}
}
bg.js
/* Create a context-menu */
chrome.contextMenus.create({
id: "myContextMenu", // <-- mandatory with event-pages
title: "4x6 Label",
contexts: ["all"]
});
/* Register a listener for the `onClicked` event */
chrome.contextMenus.onClicked.addListener(function(info, tab) {
if (tab) {
/* Create the code to be injected */
var code = [
'var input = document.getElementsByClassName("psSelect");',
'for(var i = 0; i < inputs.length; i++) { inputs[i].disabled = false; }'
].join("\n");
console.log("Enable 4x6 was clicked.");
/* Inject the code into the current tab */
chrome.tabs.executeScript(tab.id, { code: code });
}
});

This solution worked. For whatever reason, it had to be split up into 3 files.
manifest.json
{
"name": "Enable Dropdown",
"description": "Enable Dropdown Menu",
"version": "0.3",
"manifest_version": 2,
"permissions": [
"contextMenus",
"activeTab"
],
"background": {
"persistent": false,
"scripts": ["bg.js"]
}
}
bg.js
/* Create a context-menu */
chrome.contextMenus.create({
id: "myContextMenu", // <-- mandatory with event-pages
title: "Enable Dropdown",
contexts: ["all"]
});
/* Register a listener for the `onClicked` event */
chrome.contextMenus.onClicked.addListener(function(info, tab) {
if (tab) {
/* Inject the code into the current tab */
/* chrome.tabs.executeScript(tab.id, { code: code }); */
chrome.tabs.executeScript(tab.id, {file: "content_script.js"});
}
});
content_script.js
var inputs = document.getElementsByClassName('psSelect');
for(var i = 0; i < inputs.length; i++) {
inputs[i].disabled = false;
}
document.getElementById("PrintLabelsPrinter").value = "1-1";

Chrome Extension to Redirect to URL with Parameter

I'm attempting to create a Chrome extension which will add a parameter to the end of a URL if the URL matches a given pattern (*://*.mydomain.com/s/*). Below is the manifest file and background script I have, but I cannot get it working. What am I doing wrong?
manifest.json:
{
"manifest_version": 2,
"name": "Search Grid View",
"version": "0.1",
"description": "Changes MyDomain.com search to grid view by default",
"background": {
"scripts": ["background.js"]
},
"permissions": [
"tabs",
"webRequest",
"*://*.mydomain.com/s/*",
"webRequestBlocking"
]
}
background.js:
chrome.webRequest.onBeforeRequest.addListener(
function(details) {
var currentUrl = tabs[0].url;
var newUrl = currentUrl + "&style=gridview"
return { redirectUrl: newUrl};
},
{
urls: [
'*://*.mydomain.com/s/*'
],
types: ['main_frame']
},
['blocking']);
Thanks in advance for any advice!

Use debugger - click your extension's background page on chrome://extensions page and switch to the Sources panel.
To obtain the url use onBeforeRequest's callback parameter
Check if the url is already modified.
chrome.webRequest.onBeforeRequest.addListener(
function(details) {
return {
redirectUrl: details.url +
(details.url.indexOf("?") == -1 ? "?" : "") +
(details.url.indexOf("&style=gridview") == -1 ? "&style=gridview" : "")
};
},
{urls: ['*://*.mydomain.com/s/*'], types: ['main_frame']},
['blocking']
);

jQuery datatables columnDefs issues

Why isn't jQuery datatables columnDefs working with class names? The render callback is never fired.
The documentation states:
A string - class name will be matched on the TH for the column
Also, if I change to target index [0] instead, I get an error. Also, it fires about 22 times. Shouldn't it fire 6 times? 1 for each cell with index 0?
var dataSet = [
['Trident','Internet Explorer 4.0','Win 95+','4','X'],
['Trident','Internet Explorer 5.0','Win 95+','5','C'],
['Trident','Internet Explorer 5.5','Win 95+','5.5','A'],
['Trident','Internet Explorer 6','Win 98+','6','A'],
['Trident','Internet Explorer 7','Win XP SP2+','7','A'],
['Trident','AOL browser (AOL desktop)','Win XP','6','A']
];
$('#example').dataTable( {
columnDefs: [
{
render: function ( data, type, row ) {
console.log(row);
},
targets: 'foo'
}
],
columns: [
{ "title": "Engine", class: 'foo' },
{ "title": "Browser" },
{ "title": "Platform" },
{ "title": "Version", "class": "center" },
{ "title": "Grade", "class": "center" }
],
data: dataSet
});
http://jsfiddle.net/y3fnvzad/1/

There is no columns.class property, use columns.className instead.
You're getting error when changing to targets:[0] because your columnDefs.render callback doesn't return any data, which it should. Using targets:0 or targets:[0] is a preferred way to refer to a column unless you need to refer using class name by design.
columnDefs.render fires more times than number of cells because this callback function is being called not only for display event but many others (filtering, sorting, etc.).
Your corrected code is:
var dataSet = [
['Trident','Internet Explorer 4.0','Win 95+','4','X'],
['Trident','Internet Explorer 5.0','Win 95+','5','C'],
['Trident','Internet Explorer 5.5','Win 95+','5.5','A'],
['Trident','Internet Explorer 6','Win 98+','6','A'],
['Trident','Internet Explorer 7','Win XP SP2+','7','A'],
['Trident','AOL browser (AOL desktop)','Win XP','6','A']
];
$('#example').dataTable( {
columnDefs: [
{
render: function ( data, type, row, meta ) {
console.log(type, data, row);
return data;
},
targets: 0
}
],
columns: [
{ "title": "Engine", "className": "foo" },
{ "title": "Browser" },
{ "title": "Platform" },
{ "title": "Version", "className": "center" },
{ "title": "Grade", "className": "center" }
],
data: dataSet
});
See this JSFiddle for demonstration.
Optimized code
If you don't need to refer to a column by class name, your code could be optimized further. columnDefs.render callback could be defined in columns property. I have also added type detection in render callback to demonstrate how it could be used.
See the code below.
var dataSet = [
['Trident','Internet Explorer 4.0','Win 95+','4','X'],
['Trident','Internet Explorer 5.0','Win 95+','5','C'],
['Trident','Internet Explorer 5.5','Win 95+','5.5','A'],
['Trident','Internet Explorer 6','Win 98+','6','A'],
['Trident','Internet Explorer 7','Win XP SP2+','7','A'],
['Trident','AOL browser (AOL desktop)','Win XP','6','A']
];
$('#example').dataTable( {
columns: [
{
"title": "Engine",
"className": "foo",
"render": function ( data, type, row, meta ) {
// If data is being displayed
if(type === "display"){
return "<b>" + data + "</b>";
// Otherwise, if data is not being displayed
} else {
return data;
}
},
},
{ "title": "Browser" },
{ "title": "Platform" },
{ "title": "Version", "className": "center" },
{ "title": "Grade", "className": "center" }
],
data: dataSet
});
See this JSFiddle for demonstration.