How can I access the AST that VSCode creates - visual-studio-code

I write a VSCode Extension for UI5 JavaScript. The most missing Feature is to have IntelliSense for UI5. Using UI5 typings it will work but not in all.
This works:
var testvar1 = new sap.m.Button();
Now i can use IntelliSense in VSCode in the testvar1.
The Problem e.g.:
sap.ui.define([
"sap/ui/core/mvc/Controller"
],
function (Controller) {
"use strict";
return Controller.extend("", {
});
});
In this case there is a Controller variable in the function, this variable is defined with the Namespace before. I search now for a possibility to assign this variable in my Extension with the Namespace. I know this can be done in the AST but i have now idear how to get access to the AST to set:
Controller = sap.ui.core.mvc.Controller
The goal is to have the full IntelliSense now in the variable Controller
I hope it is clear what i want, so far.

If you only need to give a type to Controller, try using JSDoc:
sap.ui.define([
"sap/ui/core/mvc/Controller"
], function (/** #type {sap.m.Controller} */Controller) {
// ...
});
To answer the original question, you can access/modify the AST with a TypeScript server plugin. This is not trivial so I would try to avoid doing this unless you really need to.

Related

Access to methods of UI5 control instance from View [duplicate]

I am using SAP UI5 1.52. My formatter file is a separate file and loaded in the controller. But logging this in the formatter returns view instance rather than control instance.
I have referred this question before and tried using absolute path and changed the way object is returned in formatter. It throws an error saying function not found.
UI5 1.69+
View
<MyControl xmlns:core="sap.ui.core" core:require="{ format: 'demo/model/format' }"
property="{
path: '...',
formatter: 'format'
}"
/><!-- Note: remove the dot (.) in front of the formatter function name -->
Formatter
sap.ui.define([], function() { // location: "demo/model/format.js"
"use strict";
return function(data) {
// this === control instance
};
});
As of UI5 1.69, we can require modules directly in the view definition. Requiring and assigning the formatter directly in the binding info lets us to use this as the corresponding control instance.
The documentation mentions it as well:
From the API reference sap/ui/base/ManagedObject#bindProperty:
When the formatter for a property binding (simple or composite) is called, the managed object will be given as this context
From the topic Property Binding:
The this context of a formatter function is generally set to the
control (or managed object) that owns the binding.
In a control's property, you typically write formatter:'.formatter.functionName'
Just change it to: formatter:'namespace.controllerFolder.controllerName.prototype.formatter.functionName'
And this will now refer to the control instance rather than your controller.
Simple and easy :)

How to update content of an existing jodit editor in a function

i use jodit in my website and wonder, how the content of an existing jodit editor can be updated within a function.
first i do....
$( document ).ready(function() {
var editor_adressblock = new Jodit('#adressblock', {
fullsize: false
});
});
and the editor is correctly created.
I have a function, which can be executed by the user and then should load content (via json-request) and then put the content into the existing jodit textarea.
Here is my try (for this example i have simplified the function) :
function takeover_adressblock(kunde_id, kunden_adresse_id) {
// get data by ajax.... not shown in this example
var data_by_ajax="test";
editor_adressblock.value=data_by_ajax; // this fails....
}
Means, i don't know how i can send data to the existing jodit texteditor...
I am a jquery beginner, so please don't be too hard ;-)
Best regards
Daniel
Per the documentation you seem to have the right format, so it would help to see the code for the ajax request you're making in case the issue is there.
Otherwise, I would suggest initializing the editor without jQuery in case it's a reference or scoping issue:
const editor = Jodit.make('#editor');
editor.value = '<p>start</p>';

How to have control instance as "this" in formatter?

I am using SAP UI5 1.52. My formatter file is a separate file and loaded in the controller. But logging this in the formatter returns view instance rather than control instance.
I have referred this question before and tried using absolute path and changed the way object is returned in formatter. It throws an error saying function not found.
UI5 1.69+
View
<MyControl xmlns:core="sap.ui.core" core:require="{ format: 'demo/model/format' }"
property="{
path: '...',
formatter: 'format'
}"
/><!-- Note: remove the dot (.) in front of the formatter function name -->
Formatter
sap.ui.define([], function() { // location: "demo/model/format.js"
"use strict";
return function(data) {
// this === control instance
};
});
As of UI5 1.69, we can require modules directly in the view definition. Requiring and assigning the formatter directly in the binding info lets us to use this as the corresponding control instance.
The documentation mentions it as well:
From the API reference sap/ui/base/ManagedObject#bindProperty:
When the formatter for a property binding (simple or composite) is called, the managed object will be given as this context
From the topic Property Binding:
The this context of a formatter function is generally set to the
control (or managed object) that owns the binding.
In a control's property, you typically write formatter:'.formatter.functionName'
Just change it to: formatter:'namespace.controllerFolder.controllerName.prototype.formatter.functionName'
And this will now refer to the control instance rather than your controller.
Simple and easy :)

Typo3 Extension PHP View

Using the infos in this link:
https://docs.typo3.org/typo3cms/ExtbaseFluidBook/8-Fluid/9-using-php-based-views.html
I try to create an action to output a JSON.
I have a normal controller with the list action:
public function listAction()
{
$storelocators = $this->storelocatorRepository->findAll();
$this->view->assign('storelocators', $storelocators);
}
And in ext/my_storelocator/Classes/View/Storelocator I have a class List.php:
<?
class Tx_MyStorelocator_View_Storelocator_List extends Tx_Extbase_MVC_View_AbstractView {
public function render() {
return 'Hello World';
}
}
All I get is:
Sorry, the requested view was not found.
The technical reason is: No template was found. View could not be resolved for action "list" in class "My\MyStorelocator\Controller\StorelocatorController".
So I guess there is something wrong with the paths. Or where is the Problem?
Edit: Extensioninfos
Vendor: My
key: my_storelocator
controller: NOT SURE (I created it with the extension_builder so I guess my controllers name is Storelocator)
action: list
From my understanding a classname like Tx_MyStorelocator_View_Storelocator_List should be correct. But its not working
You will need to create an empty file for the HTML view for your controller, e.g. Resources/Private/Template/Storelocator/List.html, even if you do not plan to use the HTML view or if you just return the content yourself (which is perfectly fine).
The reason for this is simply technical limitation.
First of all, TYPO3 now has a built-in JSON view, described thoroughly here: https://usetypo3.com/json-view.html. It lets you easily define which properties you'd like to render.
The error message means that your Controller is still pointing to the TemplateView - because thats the error the TemplateView throws if it can't find the defined template file.
You can specify which view to use to render within your controller. You can either set a default view via the $defaultViewObjectName property, like so:
/**
* #var string
*/
protected $defaultViewObjectName = '\TYPO3\CMS\Fluid\View\TemplateView';
You can also set it from within the Controller inside initialization actions like so:
public function initializeExportPDFAction(){
$this->defaultViewObjectName = 'Vendor\Extension\View\FileTransferView';
}
(I have, however, not yet found a way to define the template from within actions, any tips in the comments would be appreciated)
Your path syntax is probably out of date. Instead of writing a render() function in Classes/View/Storelocator/List.php, try writing a listAction() function in a Classes/Controller/StorelocatorController.php file. Extension Builder should have created this file for you, if you made an aggregate model with the usual "list, create, edit ..." and such actions.
Review A journey through the Blog Example and the following chapter, Creating a first extension, for tips.
Keep in mind that there is a mismatch between the documentation and the Extension Builder generated PHP code files. Developing TYPO3 Extensions with Extbase and Fluid has some parts up to date, and other parts still using old syntax.

Why is `this` binded to window?

I need to get a href value after click. My code looks like this:
$('.menu a').click (event) =>
event.preventDefault()
console.log($(this).attr('href')) # it returns 'undefined'
What am I doing wrong?
[edited]
My html code:
<div class="menu">
All
</div>
This is because of the subtle difference in Coffeescript between => and ->
In JavaScript, the this keyword is dynamically scoped to mean the
object that the current function is attached to. If you pass a
function as a callback or attach it to a different object, the
original value of this will be lost. If you're not familiar with this
behavior, this Digital Web article gives a good overview of the
quirks.
The fat arrow => can be used to both define a function, and to bind it
to the current value of this, right on the spot. This is helpful when
using callback-based libraries like Prototype or jQuery, for creating
iterator functions to pass to each, or event-handler functions to use
with bind. Functions created with the fat arrow are able to access
properties of the this where they're defined.
http://coffeescript.org/
This is why this is binded to window.
You should use:
$('.menu a').click (event) ->
event.preventDefault()
console.log($(this).attr('href')) # it returns the link !