Debug dei componenti dell'interfaccia utente


16

Sto cercando di creare un modulo CRUD che utilizza componenti dell'interfaccia utente per la griglia e il modulo di amministrazione.
L'ho già fatto e funzionato, ma questo è un po 'diverso e apparentemente ho rovinato qualcosa.
Il problema si trova sicuramente nel file del componente UI o in qualche classe a cui fa riferimento il file del componente UI. Se rimuovo il riferimento del componente dell'interfaccia utente dal file di layout, la pagina viene caricata (senza griglia ovviamente).
Quando si include il componente UI, la pagina è vuota e non viene registrato alcun errore, anche in modalità sviluppatore.

Come / dove posso iniziare il debug del caricamento e del rendering dei componenti dell'interfaccia utente?


Ho avuto lo stesso problema prima di qualche giorno fa. Era a causa della struttura delle cartelle errata della cartella ui_component. Poi c'è stato un problema in di.xml
Bhupendra Jadeja

Per il momento non mi interessa il mio errore. Mi importa di come posso eseguire il debug di questo poiché potrebbe accadere in futuro.
Marius

è molto noioso eseguire il debug dell'XML. Ogni volta che ho ricevuto un errore in report e system.xml. Spero di ricevere risposta dal team principale.
Bhupendra Jadeja,

hai avuto modo di eseguire il debug di XML?
Bhupendra Jadeja,

1
Ho trovato un punto nell'applicazione in cui posso iniziare, ma non sono ancora sicuro che non sia il punto migliore per farlo. Invierò una risposta oggi o domani se trovo qualcosa di solido.
Marius

Risposte:


12

Quello che ho trovato finora è che quando si esegue il rendering del layout questo stack viene seguito.

  • \Magento\Framework\View\Layout::generateElements
  • \Magento\Framework\View\Layout\GeneratorPool::process

Ora, a seconda del tipo di layout, viene chiamato un generatore di layout diverso

foreach ($this->generators as $generator) {
    $generator->process($readerContext, $generatorContext);
}

Per i componenti dell'interfaccia utente ... continuando lo stack:

  • \Magento\Framework\View\Layout\Generator\UiComponent::process()
  • \Magento\Framework\View\Layout\Generator\UiComponent::generateComponent()
  • \Magento\Framework\View\Element\UiComponentFactory::create()
  • \Magento\Ui\Model\Manager::prepareData()
  • \Magento\Ui\Model\Manager::evaluateComponents()
  • Magento\Framework\Data\Argument\InterpreterInterface::evaluate.

Anche in questo caso dipende dal tipo di argomento che deve essere interpretato.
Puoi trovare alcuni interpreti quilib/internal/Magento/Framework/Data/Argument/Interpreter/

Questo è quanto ho ottenuto.
So che non è una spiegazione completa, ma questi sono alcuni punti in cui puoi identificare se qualcosa non va nel tuo componente dell'interfaccia utente.


1

Provare:

Source/vendor/magento/module-ui/Component/Wrapper/UiComponent.php

metodo: protected function _toHtml()

approssimativamente a partire dalla riga 57

Debug $resulte dovrebbe contenere tutti i componenti caricati.


0

L'unico modo in cui sono stato in grado di eseguire il debug dei componenti dell'interfaccia utente è semplicemente rimuovere tutto dal componente xml e aggiungere elementi uno alla volta assicurandomi che gli attributi siano supportati in xsd.


1
il file è valido rispetto al file xsd. E sono sicuro che esiste un altro modo oltre alla rimozione di bit del file. Deve esserci un luogo in cui il file viene caricato ed elaborato.
Marius

0

Puoi iniziare a usare css per iniziare il debug, puoi usare il file theme.less in app / design / frontend / Mgs / molly / web / css ad es. Cambiare il colore di base che è @ base-color: @ 7c7bad

dopo aver modificato qualsiasi codice che hai eliminato var directory, hai un contenuto chiaro nella directory frontend di pub / static / frontend /

Finalmente comando hit in cmd php bin / magento setup: static-content: deploy


Cosa c'entra il css con il debug dei componenti dell'interfaccia utente?
Marius

Puoi cambiarne il layout o il colore. @Marius
vnnogile_user

Questo non ha nulla a che fare con la domanda. Non ho chiesto di cambiare i colori.
Marius

0

Vorrei iniziare con:

Magento\Ui\TemplateEngine\Xhtml\Result->__toString( )

Questo è il luogo in cui Ui XML viene messo insieme. Quindi questo dovrebbe essere un punto di partenza per il debug Ui XML.

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.