I've got a custom module I'm creating called touchpoints. At the top of the touchpoints.module file I have the following:
global $base_path;
$my_settings = array(
'basepath' => $base_path,
'module_path' => drupal_get_path('module','touchpoints')
);
drupal_add_js(array('touchpoints' => $my_settings), 'setting');
drupal_add_js(drupal_get_path('module','touchpoints') . '/touchpoints.js');
Then in my touchpoints.js file I have the following:
Drupal.behaviors.touchpoints = function(context){
$('.form-item-touchpointlocation').css('display','block');
$('.form-item-touchpointcategory').css('display','none');
}
It's my understanding that anything inside the Drupal.behaviors call should run when the DOM finishes loading similar to a $(document).ready call. However, this code isn't being executed. Just to be sure I put an alert in the function as well, and it wasn't being triggered. Is there a step I'm missing?
I realized I was using Drupal 6 syntax. In Drupal 7 you have to declare behaviors differently. It should have looked like this
(function ($) {
Drupal.behaviors.touchpoints = {
attach: function (context, settings) {
$('.form-item-touchpointlocation').css('display','block');
$('.form-item-touchpointcategory').css('display','none');
}
};
})(jQuery);
For reference see: http://drupal.org/node/756722
Related
I'm trying to create a plugin for Figma, which has been going fine until now. It's based on the react example they provide on their github page: https://github.com/figma/plugin-samples/tree/master/react
In this example I've created a button, that on click will call this function:
(file: ui.tsx)
onClick = () => {
parent.postMessage({pluginMessage: {type: 'GetData'}}, '*');
};
This is parent.postMessage is a function figma provides to communicate with another file in the project, code.ts. This file will receive the postMessage with the pluginMessage as parameter, which works as expected. The code.ts that receives this looks like this:
(file: code.ts)
figma.ui.onmessage = msg => {
if (msg.type === 'GetData') {
figma.ui.postMessage({"title": figma.currentPage.selection[0].name});
}
};
This file receives the message, and it gets in the if statement since GetData has been set. Up until here, everything is good and well. The issue I'm walking into is the figma.ui.postMessage({}), which should do a callback to the onmessage function in ui.tsx:
(file: ui.tsx)
onmessage = (selection) => {
console.log(selection);
};
This onmessage function should, according to Figma's documentation, receive the object from the postMessage in code.ts. This does however never happen; it will never be called at all. I can't access the current selection in ui.tsx, so I need data from code.ts. Is there any way to pass this data to ui.tsx, or does anyone know why this doesn't work?
I encountered the same issue. Within your ui.tsx file, try adding the following:
window.onmessage = selection => {
let message = selection.data.pluginMessage;
console.log(message);
}
or try this ->
window.addEventListener("message", (selection) => {
console.log(selection);
});
this will add another message event handler to the window. if you use onmessage it might overwrite the previous handler!
put first of script
onmessage = event => {
console.log("got this from the plugin code", event, event.data.pluginMessage)
}
I've been developing an app in react.
Just a Simple app, it has a feature where I check toggle/toggle state for items inside a list.
At utils.js I have
export const partial = (fn, ...args) => fn.bind(null, ...args)
const _pipe = (f, g) => (...args) => g(f(...args))
export const pipe = (...fns) => fns.reduce(_pipe)
but the there is a problem in App.js, when using the utils:
const getToggledTodo = pipe(findById, toggleCompleted)
the helpers' imports seem fine:
import {pipe, partial} from './lib/utils'
import {addTodo, generateId, findById, toggleCompleted,
updateTodo, removeTodo, filterTodos} from './lib/todoHelpers'
Still , the app complains
Uncaught TypeError: Cannot read property 'find' of undefined
doing console I get:
f2: function () {
return g(f.apply(undefined, arguments));
}
I looked at:
at findById (todoHelpers.js:15)
at utils.js:10
at Object.executeOnChange (LinkedValueUtils.js:132)
and seems to me the undefined is coming from linkedValue file at last line:
executeOnChange: function (inputProps, event) {
if (inputProps.valueLink) {
_assertValueLink(inputProps);
return inputProps.valueLink.requestChange(event.target.value);
} else if (inputProps.checkedLink) {
_assertCheckedLink(inputProps);
return inputProps.checkedLink.requestChange(event.target.checked);
} else if (inputProps.onChange) {
return inputProps.onChange.call(undefined, event);
}
}
};
Not sure how .apply and .call relate to each other here, and seems to me that I'm missing an argument somewhere.
The final objective is to update of state complete/not complete in the db, plus an message in the UI saying that in fact the item has been updated.
Fun fact: if I hard code some similar structured object in App.js and use it in memory to change state, the error does not show... o_O.
It only appears when trying to connect to a 'db', which is still of course a mock. Don't know if its related but I think is worth mentioning.
Using json-server to mock db objects.
So my question is: how to debug this error? Can someone help me understand a bit how apply and call relate to this error.
Any pointers in the right direction would be very helpful and much appreciated.
I want to pass an array using the Slim Framework Flash Messages service provider but my array is converted to a string and therefore the whole thing falls short...
If I understand correctly the code for the addMessage method it should be working, except it's not.
Here a little example:
session_start();
$app = new \Slim\App(['settings' => ['displayErrorDetails' => true]]);
$container = $app->getContainer();
$container['flash'] = function() {
return new \Slim\Flash\Messages();
};
$app->get('/foo', function ($request, $response, $args) {
$this->flash->addMessage('test', ['key' => 'value']);
return $response->withStatus(302)->withHeader('Location', '/bar');
});
$app->get('/bar', function ($request, $response, $args) {
$messages = $this->flash->getMessages();
print_r($messages); // returns Array ( [test] => Array ( [0] => Array ) )
});
$app->run();
Am I missing something?
It's related to the version of slim-flash that you are using. If you check the differences between the current (only one) version (0.1.0) and master branch, you'll discover that the bug you're facing was fixed in PR 12.
While we wait for another release, you can temporarily use the dev-master version in composer.json and all will work fine:
"slim/flash": "dev-master"
I have a test that clicks a button and redirects to a user dashboard. When this happens Webdriver returns:
javascript error: document unloaded while waiting for result.
To fix this I insert browser.sleep(2000) at the point where redirection occurs and assuming my CPU usage is low, this solves the issue. However, 2000 ms is arbitrary and slow. Is there something like browser.waitForAngular() that will wait for the angular to load on the redirected page before the expect(..)?
it('should create a new user', () => {
$signUp.click();
$email.sendKeys((new Date().getTime()) + '#.com');
$password.sendKeys('12345');
$submit.click();
browser.sleep(2000); // Need alternative to sleep...
// This doesn't do it...
// browser.sleep(1);
// browser.waitForAngular();
$body.evaluate('user')
.then((user) => {
expect(user).toBe(true);
});
});
do you think something like this could work for you? This will wait up to 10 seconds for the url to include the text 'pageTwo', or whatever you put in.
var nextPageButton = $('#nextPage');
nextPageButton.click().then(function(){
return browser.driver.wait(function() {
return browser.driver.getCurrentUrl().then(function(url) {
return /pageTwo/.test(url);
});
}, 10000);
};
Just stick in the regex of the url you are expecting.
Alternatively, you could wait for an element from the next page to appear as well:
var nextPageButton = $('#nextPage');
nextPageButton.click();
var elementFromSecondPage = $('#coolElement');
browser.wait(protractor.until.elementIsVisible(elementFromSecondPage), 5000, 'Error: Element did not display within 5 seconds');
When using .click, protractor will naturally wait for angular to finish the action attached to the click, such as changing the page. But, while the page change, you may still be needing something specific to be loaded, so the test fails before that part is available. Using this, it should wait for the click part to finish, then wait for the element to appear.
To expand on user2020347's answer:
Thanks that solved my issue. I wonder why this isn't a built in function. I'll be using this in many places to wait for browser navigation.
To make it more concise, I made a little helper:
Object.assign(global, {
waitUntilURLContains: string => {
let fn = () => {
return browser.driver.wait(() => {
return browser.driver.getCurrentUrl().then((url) => {
return url.includes(string);
});
}, waitDelay);
}
return fn.bind(null, string);
}
});
In my test:
$button.click().then(waitUntilURLContains('dashboard'));
keeping it very simple. I was also running into the same problem but was able to solve it using the following code :
page.setUsername(objectrepository.userdetails.useremail);
page.setPassword(objectrepository.userdetails.userpassword);
page.login().click();
**browser.wait(EC.visibilityOf(page.greetingMessageElement()), 5000);**
page.greetingMessageElement().getText()
.then(function (value){
expect(browser.getCurrentUrl()).toContain("#/mytickets");
});
The below is an excerpt from the controller for the page I am loading (in coffeescript - but should be straightforward to read). Once I have data from the server, I transform it into a json array of arrays. onChartDataReady then runs, loads 3 files via the jsapi all with http status 200, but onGoogleReady is never called.
onDataLoad: (data) =>
# #$scope.chartData = transformed data
#onChartDataReady()
onChartDataReady: =>
google.load 'visualization', '1', { packages: ['corechart'] }
google.setOnLoadCallback #onGoogleReady
onGoogleReady: =>
chartTable = google.visualization.arrayToDataTable #$scope.chartData
chartOptions = { title: 'Some silly data' }
chart = new google.visualization.LineChart document.getElementById('chart_div')
chart.draw chartTable, chartOptions
I copied the quickstart code from google and pasted that into a html file with no controller (i.e. angular is just loading the html) but it has the same problem - callback is not called. When I open the file from my desktop it works fine. Somehow angular is interfering with the google callback and I do not know how to troubleshoot.
Any pointers would be very helpful! Thanks.
This might be related to an odd behavior in the google loader. Try passing the callback inline with the google.load call instead of calling google.setOnLoadCallback. The javascript would look like this:
google.load('visualization', '1', { packages: ['corechart'], callback: <callback function> });
I'm not a coffescript expert, but I think this is the syntax you would use:
google.load 'visualization', '1', { packages: ['corechart'], callback: #onGoogleReady }