[AC-834] `Widget` Scope Not Available in CommonJS Modules

GitHub Issue	n/a
Type	Bug
Priority	n/a
Status	Closed
Resolution	Cannot Reproduce
Resolution Date	2014-09-01T06:51:31.000+0000
Affected Version/s	n/a
Fix Version/s	n/a
Components	Alloy
Labels	Alloy, TCSupport
Reporter	Allen Hartwig
Assignee	Mauro Parra-Miranda
Created	2014-06-18T17:23:16.000+0000
Updated	2016-03-08T07:37:07.000+0000

Description

When developing an Alloy Widget, the Widget scope is not available in CommonJS modules used within the widget. It seems like Widget should be available much like Alloy is available throughout all project JS resources. When defining models and collections on the Widget level, it makes it difficult to access them from CommonJS assets within a widget. I understand the Widget context can be passed into a module, however, this becomes tedious when dealing with a large project with many modules. The Widget context be globally available on the widget level, no matter if it is a /controller/.js file or a /lib/.js file.

Comments

Allen Hartwig 2014-06-18

Additionally the WPATH() method does not seem to be accessible outside of the controller directory, including the models directory. If a /models/myModel.js would like to use a common utils.js CommonJS in the /lib/ folder of my widget, there is no way to easily require it; relative paths don't even work, eg: require('../lib/utils.js').

Motiur Rahman 2014-08-10

Hello, We have tested this issue for a simple test case. And we can pass value from widget to commonJS scope easily.

Testing Environment:

Titanium SDK: 3.3.0.GA, Titanium CLI: 3.3.0, Android SDK: 4.4.2,4.2.2, IOS Simulator: 7.1, OS X Version: 10.9.3, Appcelerator Studio: 3.3.0

Steps to Test:

1. Create a Alloy project. 2. Create a widget named test . 2. Paste this code in index.js , index.xml file and widget.js ,widget.xml file 3. Run this code with the testing environment.

Test Code

   <Alloy>
   	<Window class="container" layout='vertical'>
   		<Widget id='testWidget' src="test" ></Widget>
   		<Button width="Ti.UI.SIZE" height="Ti.UI.SIZE" onClick="doClick" top="20" title="Show"></Button>
   	</Window>
   </Alloy>

   function doClick() {
   	alert($.testWidget.testValue());
   
   }
   
   $.index.open();

   <Alloy>
   
   	<View height="80">
   		<TextField id='text' width="Ti.UI.FILL" height="Ti.UI.SIZE" hintText="Enter Some Things" borderRadius="6" borderWidth="2" borderColor="red" top="30" color="#000"></TextField>
   		
   	</View>
   </Alloy>

   exports.testValue = function() {
   
   	return $.text.value;
   
   };

Thanks.

Mauro Parra-Miranda 2014-09-01

Please take a look into the provided testcase. If you can still reproduce, please provide a testcase that will show the issue.

Reymundo López 2014-12-11

The example provided is wrong, it does not make use of any CommonJS modules inside of the /lib folder inside of the widget, here is a more apropiate example: * Create a blank Alloy App * Create a widget called test * Add the two CommonJS modules listed bellow * Try to run the app

   function doClick(e) {
       alert($.label.text);
   }
   
   $.index.open();

   <Alloy>
   	<Window class="container">
   		<Widget id="testWidget" src="test" />
   		<Label id="label" onClick="doClick">Hello, World</Label>
   	</Window>
   </Alloy>

   <Alloy>
   	<Label onClick="startWorking">I'm the default widget</Label>
   </Alloy>

   var simple = require(WPATH('simple'));
   
   function startWorking(){
   	simple.getSolutionToWork();
   }

   var solution = require(WPATH('solution'));
   module.exports = (function(){
   	var getSolutionToWork = function(){
   		solution.work();
   	};
   
   	return { 
   		getSolutionToWork : getSolutionToWork
   	};
   })();

   module.exports = (function(){
   	var work = function(){
   		Ti.API.log("I'm working");
   	};
   
   	return { 
   		work : work
   	};
   })();

Expected result will be to get a message in the console. Actual result is Can't find variable: WPATH And the same goes for Widget.generateController() or the Widget variable alone inside of any CommonJS file located inside of the lib folder of any widget.

Vincent Degroote 2015-02-13

Hello, I have the same problem, my fix was to inject from the controller the Widget namespace or the WPATH helper into the lib. It becomes really annoying when you want to require a lib into another. Could we reopen this issue?

JSON Source